I understand the forms and different types of input but i’m assuming the page after you press the submit button is another landing page. I just wanted to confirm is this the code that would take the visitor there ?
You can set the action attribute on the form element:
which could be many things, usually its a request to the server, which then processes the form, and sends back a response (often a page)
In this exercise the
<form> element has its
action attribute set to
"submission.html" as follows:
<form action="submission.html" method="POST">
From what I can see, the file
submission.html only contains code to generate the page Thanks for your submission! (the response generated on clicking the form’s submit button). However, my understanding from exercise 2 - How a Form Works and exercise 14 - Forms Review is that the
action attribute determines where the information collected in the form is sent when it’s submitted i.e. where the
name="value" pairs end up being stored for further processing by the end user.
Are we not seeing any code in
submission.html for the transfer of these
name="value" pairs, because this is just an example and the form’s information is not actually being processed and transferred somewhere else? What would we see in actual practice? Would there be additional code triggered by the
"value", which together with the
method="POST" attribute would cause the form to be processed and its data transferred (in addition to the response page being displayed to the person who completed and submitted the form)?
Or am I misunderstanding something?
a back-end, where we actually process the information. This could be a lot of different things.
The login you use at many websites? That is a form, so in that case, the back-end has to validate your credentials and authenticate you.
The box i am currently typing my reply in could be a form with a text-area, which would need to be saved to the database.
yes, often in the back-end. Here is a nice image to demonstrate the process:
Very helpful diagram!
So, where in this exercise we see the
action attribute directly redirecting the browser to the “success” page (generated by the code in
submission.html), in practice it is more likely to have a
"value" which references to a different back-end file containing code for the first back-end process (e.g. validating the data).
Is that correct?
I’m sure we’ll learn about this in more detail in later courses, so sorry if I’m jumping the gun a bit. It’s just nice to get a broad idea early on of how this works in practice, as it helps conceptualise things more easily.
just make sure that if you jump in the deep end, that you don’t drown. Having warned for that, i think its actually a positive thing you are curious about this and ask questions
yea, you are correct.
action can also point to a url (
example.com/login for example).
lets do a very silly PHP example (PHP is a back-end language, which could run on your server), lets say we have:
<form method="POST" action="submission.php"> <input type="text" name="username"> <input type="submit" value="submit username"> </form>
html will send use the data entered based on the
name attribute of the input field. So then in submission.php we can do:
$username = $_POST['username'] # now we could write the username to a file # although often a database is used
I think it is a great excercise BUT, I dont see explained what happens when someone clicks on Submit button?
Where exactly the data is going and how to alter the adress of Submit button?
I think it should be part of the lesson. I’m really curius about this question.
Does any of You know this?
Looks like I first asked then researched in the lesson.
<form action="/example.html" method=“POST”> <h1>Creating a form</h1> <p>Looks like you want to learn how to create an HTML form. Well, the best way to learn is to play around with it.</p> </form>
Above: form action means, that by clicking the submit button the data goes to example.html webpage?
I would really apreciate a little more explanation regarding this question!
I asked some similar questions and got some really helpful replies from @stetim94:
This link takes you to my original questions, then read the posts in the thread that follow, if you find it helpful
Your question was also asked in the final review part of this lesson here. Again, read on down the thread for the response.
The form would go to https://codecademy.com/example.html` in this case. Forms are very often send to the domain (website) where they where coming from. So codecademy rendered the page with the form, so the submitted form also goes codecademy website
Very helpful indeed!
Thank You for your reply
Thanks Stetim, very helpful answer!
I don’t know if this is a question that has been asked before or I am trying to be more clear based on the explanations shown in this thread. However, I was wondering after learning how to create submit buttons what code are we supposed to use to gather and store the information received once users have already provided the input information? I hope that my question makes sense! I would greatly appreciate anyone’s help!
this can be interpreted two ways: keep the input fields populated after invalid form submission or how to retrieve stored information
this won’t be covered within the html course, given this involves a database (mysql for example) and a programming language to validate, store and retrieve the information (c#, java, python, ruby, golang to name a few)
Ok gotcha. Thanks I appreciate your response!
Can I see what I have submitted? Or to ask differently: If I made a website with
<form>, how could I see what the reader submited?
normally you would send the form back to your server/back-end where you can validate and store the data.
I’m guessing with another programming language? Or HTML again?
you can set the
action attribute on the form element, this will point to the forum endpoint, but yes, the back-end requires the use of other languages
if you are just curious, you could also just use JS to see the form:
So to follow up that question - when the request is sent to the server - u would need corresponding code in your js file or does your html communicate to the server via the browser directly? and via http command transfer the data from the form in a json?