Project 6 Creating Forms on a Web Page

Objectives Define terms related to forms Describe the different form controls and their uses Use the tag Create radio buttons Create a text field Create a textarea field

Objectives Use the tag Create a selection menu Insert options into a selection menu Create a Submit button Create a Reset button

Introduction Forms allow Web developers to collect visitor feedback Forms create an environment that invites people to return to the site This project will teach you how to convert two HTML documents into forms

Introduction Web page without a form Web page with a form

Creating Web Page Forms Forms interact with Web page visitors in a variety of ways:  Get feedback about the Web page  Find out who is visiting the Web page  Sell products or services  Act as a guestbook

Creating Web Page Forms A Web page form has three components  Input controls  FORM tag, which contains the information necessary to process the form  Submit button, which sends the data to be processed

Input Controls An input control is a type of input mechanism on a form A data input control allows a user to simply make a selection A text input control allows the user to enter text into the control

Input Controls

Text Control Allows for a single line of input Two attributes  SIZE: determines the number of characters that display on the form  MAXLENGTH: specifies the maximum length of the input field

Password Control Same as a regular text field, but characters display as asterisks or bullets Holds the password entered by a visitor Protects a visitor’s password from being observed by others

Textarea Control Allows multiple lines of input Two primary attributes  ROWS: specifies the number of rows in the textarea field  COLS: specifies the number of columns in the textarea field

Select Control Creates a selection menu from which visitors can select one or more choices Visitors don’t have to type in any information

Checkbox Control Allows users to select more than once choice from a list of choices Each choice in a checkbox list can be either on or off  Checkboxes are deselected by default

Radio Control Limits the Web page visitor to only one choice from a list of choices Each choice is preceded by a radio button, typically an open circle  Radio buttons are deselected by default

Reset and Submit Controls The Reset button clears any input that was entered in the form The Submit button sends the information to the appropriate location for processing  Web page forms must include a Submit button

Input Controls Each input control has the following one or two attributes  NAME: Identifies the specific information that is being sent All controls have a NAME  VALUE: The data that is contained in the named input control All controls except TEXTAREA have a VALUE attribute

Form Tags Input controls are tags or attributes of tags: