Did you know?

if you register at Hamid School you can save up to 45% on hosting packages offered by Surreyhost.com .

Don't miss out, every minute counts!

Register now!

Are you Confused? Click here to learn how to use hamid school

HTML Forms and Input

HTML Forms are used to select different kinds of user input.Forms

A form is an area that can contain form elements.

Form elements are elements that allow the user to enter information (like text fields, textarea fields, drop-down menus, radio buttons, checkboxes, etc.) in a form.

A form is defined with the <form> tag.

<form>
  <input>
  <input>
</form>

Input

The most used form tag is the <input> tag. The type of input is specified with the type attribute. The most commonly used input types are explained below.

Text Fields

Text fields are used when you want the user to type letters, numbers, etc. in a form.

<form>
First name: 
<input type="text" name="firstname">
<br>
Last name: 
<input type="text" name="lastname">
</form>

How it looks in a browser:

Note that the form itself is not visible. Also note that in most browsers, the width of the text field is 20 characters by default. 

Radio Buttons

Radio Buttons are used when you want the user to select one of a limited number of choices.

<form>
<input type="radio" name="sex" value="male"> Male
<br>
<input type="radio" name="sex" value="female"> Female
</form>

How it looks in a browser:

Note that only one option can be chosen.

Checkboxes

Checkboxes are used when you want the user to select one or more options of a limited number of choices.

<form>
I have a bike:
<input type="checkbox" name="vehicle" value="Bike">
<br>
I have a car: 
<input type="checkbox" name="vehicle" value="Car">
<br>
I have an airplane: 
<input type="checkbox" name="vehicle" value="Airplane">
</form>

How it looks in a browser:

The Form's Action Attribute and the Submit Button

When the user clicks on the "Submit" button, the content of the form is sent to another file. The form's action attribute defines the name of the file to send the content to. The file defined in the action attribute usually does something with the received input.

<form name="input" action="html_form_action.asp"
method="get">
Username: 
<input type="text" name="user">
<input type="submit" value="Submit">
</form>

How it looks in a browser:

If you type some characters in the text field above, and click the "Submit" button, you will send your input to a page called "html_form_action.asp". That page will show you the received input.

• Introduction to HTML
• HTML Elements
• Basic HTML Tags
• HTML Attributes
• HTML Text Formatting
• HTML Character Entities
• HTML Links
• HTML Frames
• HTML Tables
• HTML Lists
• HTML Images
• HTML Backgrounds
• HTML Colors
• HTML Color Values
• HTML Color Names
• HTML 4.01 Quick List
• HTML Layout
• HTML Fonts
• Why use HTML 4.0
• HTML Styles
• HTML Head
• HTML Meta
• HTML Uniform Resource Locators
• HTML Scripts
• HTML 4.0 Standard Attributes
• HTML 4.0 Event Attributes
• HTML URL encoding Reference
• Ready to Publish Your Work
• You Have Learned HTML, Now What
• XHTML - Why
• You Have Learned XHTML, Now What

Did you know?

if you register at Hamid School you can learn web programming and designing for free and also you can save up to 45% on hosting packages offered by Surreyhost.com .

Don't miss out, every minute counts!

Register now!