HTML Forms

HTML forms are used to pass data to a server.

An HTML form can contain input elements like text fields, checkboxes, radio-buttons, submit buttons and more. A form can also contain select lists, textarea, fieldset, legend, and label elements.

The <form> tag is used to create an HTML form:

GET Method:

  1. All the name value pairs are submitted as a query string in URL.
  2. It’s not secured as it is visible in plain text format in the Location bar of the web browser.
  3. As the data transfers through address bar (URL) there are some restrictions in using space, some characters like ampersand (&) etc in the GET method of posting data. We have to take special care for encoding data if such special characters are present.
  4. Length of the string is restricted.
  5. If method is not mentioned in the Form tag, this is the default method used.
  6. If get method is used and if the page is refreshed it would not prompt before the request is submitted again.
  7. One can store the name value pairs as bookmark and directly be used while sharing with others – example search results.
  8. Data is always submitted in the form of text
  9. If the response of the page is always same for the posted query then use GET example database searches

POST Method:

1. All the name value pairs are submitted in the Message Body of the request.

2. Length of the string (amount of data submitted) is not restricted.

3. Post Method is secured because Name-Value pairs cannot be seen in location bar of the web browser.

4. If post method is used and if the page is refreshed it would prompt before the request is resubmitted.

5. If the service associated with the processing of a form has side effects (for example, modification of a database or subscription to a service), the method should be POST.

6. Data is submitted in the form as specified in enctype attribute of form tag and thus files can be used in FileUpload input box.

 

<!DOCTYPE HTML>
<html>
<body>
<script></script>

<form name=”htmlform” method=”post” action=”html_form_send.html”>
<table width=”450px”>
<tr>
<td valign=”top”>
<label for=”first_name”>First Name *</label>
</td>
<td valign=”top”>
<input  type=”text” name=”first_name” maxlength=”50″ size=”30″>
</td>
</tr>

<tr>
<td valign=”top”>
<label for=”last_name”>Last Name *</label>
</td>
<td valign=”top”>
<input  type=”text” name=”last_name” maxlength=”50″ size=”30″>
</td>
</tr>
<tr>
<td valign=”top”>
<label for=”email”>Email Address *</label>
</td>
<td valign=”top”>
<input  type=”text” name=”email” maxlength=”80″ size=”30″>
</td>

</tr>
<tr>
<td valign=”top”>
<label for=”telephone”>Telephone Number</label>
</td>
<td valign=”top”>
<input  type=”text” name=”telephone” maxlength=”30″ size=”30″>
</td>
</tr>
<tr>
<td valign=”top”>
<label for=”comments”>Comments *</label>
</td>
<td valign=”top”>
<textarea  name=”comments” maxlength=”1000″ cols=”25″rows=”6″></textarea>
</td>

</tr>
<tr>
<td colspan=”2″ style=”text-align:center”>
<input type=”submit” value=”Submit”/>
</td>
</tr>
</table>
</form>

</body>
</html>

Comments are closed.