What happens when submit button is clicked

Question

What happens when submit button is clicked? Let I've a form which located on an http://example.com/ URL with the two input elements like this:

<form method="get">
    <input type="text" id="field1" name="namefield1"/>
    <input type="text" id="field2" name="namefield2"/>
    <input type="submit" value="submit"/>
</form>

What actually get request will be sent to an http-server in my specific case?

Answer 1

The form will be submitted to the server and the browser will redirect away to the current address of the browser and append as query string parameters the values of the input fields.

In terms of the HTTP protocol the following GET request HTTP request will be sent:

GET http://example.com/?namefield1=value1&namefield2=value2 HTTP/1.1
Host: example.com

Since your <form> is missing an action attribute, the browser will simply redirect to the current url by appending the values as query string parameters. So if this form was loaded from http://example.com/foo.php after submitting it, the browser will redirect to http://example.com/foo.php?namefield1=value1&namefield2=value2 where value1 and value2 will be the values enetered by the user in the corresponding input fields.

Also you might use your browser's built in debugging tools or Fiddler to inspect the exact payload that gets sent to the server.

Answer 2

If you submit the form with a method of 'get' then it will perform a get request thus sending the data held within your input elements on the query string as a name value pair. So for example http://example.com/index.html?field1=joe&field2=bloggs

See example here if you scroll down to the Submit Button example at the bottom: http://www.w3schools.com/html/html_forms.asp