HTML Forms

Forms are used to collect data inputted by a user. An interface for a web application to send data across the web.

FORM defines the form and within this tag, 

an action attribute is needed to tell the form where its contents will be sent to.

The method attribute tells the form how the data in it is going to be sent

 get latches the form information onto a web address
 post sends the form’s information.

EXAMPLE

<form action="processingscript.php" method="post">

</form>

action is a program or a gateway

input tag allows for data to get into the form

• <input type="text">  is a standard textbox.
•  This can also have a value attribute, sets initial text in the textbox.
• 
  
• <input type="password"> ihe characters typed in by the user will be hidden.
• 
  
• <input type="checkbox"> is a checkbox, which can be toggled on and off by the user. This can also have a checked attribute
• 
  
• <input type="checkbox" checked> - the attribute doesn’t  makes the initial state of the check box to be switched on, as it were.
• 
  
• <input type="radio"> is similar to a checkbox, but the user can only select one radio button in a group. This can also have a checked attribute.
• 
  
• <input type="submit"> is a button that will submit the form.
• 
  
•  You can control the text that appears on the submit button with the value attribute, for example <input type="submit" value="Click Me Now">.
• 
  
• Textarea

textarea is, basically, a large, multi-line textbox. The anticipated number of rows and columns can be defined with rows and cols attributes

<textarea rows="5" cols="20">A big load of text</textarea>

select

The select tag works with the option tag to make drop-down select boxes.

<select>
    <option>Option 1</option>
    <option>Option 2</option>
    <option value="third option">Option 3</option>
</select>

When the form is submitted, the value of the selected option will be sent

Names

All of the tags mentioned above will look very nice presented on the page but if you hook up your form to a form-handling script, they will all be ignored. This is because the form fields need names. So to all of the fields, the attribute name needs to be added, for example <input type="text" name="talkingsponge">.

<form action="contactus.php" method="post">

    <p>Name:</p>
    <p><input type="text" name="name" value="Your name"></p>

    <p>Species:</p>
    <p><input name="species"></p>
    <!-- remember: 'type="text"' isn't actually necessary -->

    <p>Comments: </p>
    <p><textarea name="comments" rows="5" cols="20">Your comments</textarea></p>

    <p>Are you:</p>
    <p><input type="radio" name="areyou" value="male"> Male</p>
    <p><input type="radio" name="areyou" value="female"> Female</p>
    <p><input type="radio" name="areyou" value="hermaphrodite"> An hermaphrodite</p>
    <p><input type="radio" name="areyou" value="asexual"> Asexual</p>

    <p><input type="submit"></p>

</form>

form examples