forms | action and method
Hey, i have a couple of questions about the
action and method attributes for forms-
1) With action, what necessarily does sending data to other html/pfp files etc do? I can imagine it's so you can use it with js that's hooked up to the page it's sending to to either use it in a query or display it on the page. This makes sense to me since i imagine you'd have to use a database or something similar to retrieve data between pages without this functionality. let me know if i'm wrong though please.
2) With the GET method, what's the function of appending the data to the url? What does it allow you to do?
3) When would you use GET vs POST? I assume POST when sending the form data somewhere with action. With GET, the answer depends on the answer to question 2) but it would confuse me if you had a GET method with a link in action as where is the data going at that point if you're getting data from somewhere else?
I'd appreciate any help clearing this up, thank you in advance.21 Replies
1) This would not be a question if you had learned web development before single page apps were invented. There was a time when the common practice was to send form data to the back end, and a totally new page would be loaded in the browser that was fully rendered based on the form data that the back end received. This is still possible but much less common.
2) Having the query string in the URL makes it possible to bookmark. That allows you to revisit the exact same query again. This could be useful for something like searching for flights, concert tickets, etc. You don't need to put in all the same search parameters again.
3) Use POST if the data needs to be secure and/or if there is a lot of data. There are limits to the total length that a URL can have, so a GET should not be used if a signficant amount of data is being transmitted. Because the query string is visible both in bookmarks and in browser history, GET should also be avoided if the data has to be secure.
There is one other important reason for choosing between GET or POST. There is something known as a REST API. This standard states that fetching data should be done with a GET request and submitting data for storage should be done with POST.
with POST or PUT, depending on the data
for example, imagine you have a service to mail big files
you can use POST to create the basic email, with the contents and who it is for
then, with the id of the email, you can PUT a file later on, before sending a POST saying that the email is ready to be sent
or, for example, a mod for a game
1) oh okay, that makes sense then, how would sending it there work? Is it like a private url you put in
action?
2) ah okay. if you had a search flight system like in your example, if you revisited a link with parameters in, wouldnโt you have to click the โsearchโ or submit button for it to pull up all the search results again? Or do the parameters existing tell the browser that itโs been clicked and it assumes it has? Maybe testing if the form is submitted in js that will run?
3) so if the data need to be secure, youโd use POST to send it it to the backend to put into letโs say a database? Like login details? And if itโs GET you can send it to a backend to pull the values and maybe compare them to something? Like for search results?
Ahh okay I see, thanks for the example
A quick follow up question, is the way you handle the form data on the web page it sends to what I referenced in the first question? Or something else?
If I sent data to example.com, could I then retrieve it using js on that site? Is it in itโs storage or something?you can with method="GET", but in general submitted forms are used to process data in the backend, where you would use your backend language to then process the submitted data
Oh so only js for local ones since it adds to the url? but how would you send it to a backend? What would you put as the action value?
all the values would send it to the backend too, a form submission by default causes an http request to be fired
Oh so you can retrieve the http request and its values via your backend language?
That's always part of the global state your backend has access to yes
Ahh okay that makes sense now, so if youโre sending it to another website/url thatโs how it accesses it since you can pull the http request data
Thank you for clearing that up
another or your own, but yes
And then I assume itโs the same with
GET too? You use the http request data to do things? Or is that more js orientated?yeah, GET parameters are also accessible in the backend
1) Form data gets appended to the url automatically. You don't need to add that to the action. The action is actually the base URL and the query parameters get automatically added to the end of it.
2) The whole point is you don't need to search again. When you load the URL, you just get the results. Here is an example from the Google search for "form action".
https://www.google.com/search?q=form+action&oq=form+action
Notice that the search terms are in the URL. You can just load that URL and get the search results. You do not need to click on search.
3) Something like that, but the GET results don't have to be compared to anything. It is just for getting data. For example, if I do a Google search, a GET request is sent with my search terms and the results are returned to me.
ah okay i see, thank you.
for 2), is that a built in functionality that it submits the form again when you enter a url with parameters or do you have to make that yourself?
it doesn't submit the form
It does not submit the form again. When a form is submitted using GET, it's just a request to load the page.
that's the whole point of using
GET
you can sent the url parameters without having to submit the form again
all the information was already sent to the server, as if you had submitted the formoh okay i see, so whatever parameters are in the url are just sent to the server?
yes, like a normal request
ah okay i see. thank you both
you're welcome