HTML Web Forms with Example

Forms in HTML
Up till now we have just shown html pages to users. We have not received any input from user. You take user
input in HTML in forms. Forms in HTML are just like any ordinary form you might have filled. They have
predefined structure. A typical example of a web form is as below.

Example of a web form
User Id:
Password:

You must already have seen similar forms several times. Now the syntax to create an HTML form is like
this
Code

<form>
<elements>
….
….

</form>

All form elements have at least one common attribute, “name”. This is the attribute by which the browser
recognizes the elements. If name is not specified then the browser might ignore the element and its content
while processing

All the code of the form is inside the parent element “<form>”. Inside the form we have basically two
types of elements.

  1. Static Labels and
  2. Input fields
  1. Static labels are generally the texts inside the form element. In the example above, the texts User
    Id and Password are static labels.
  2. Input fields are the fields from where we take the users response. The followings are the main types
    of HTML input fields
    An input capable field is generally defined as below

Code
<input type=”ElementType” />

Form Elements

We will learn about following form elements one by one.

  1. Text Input Field
  2. Password Input Field
  3. Textarea
  4. HTML Select
  5. Scrollable select
  6. Radio Button
  7. Checkbox
  8. Hidden Fields
  9. Normal Buttons
  10. Submit Buttons

These fields have been placed on coming pages.