Forms - Lists & Menus

Lists are scrollable boxes from which a user can choose multiple items. This can be useful when there’s a long list of choices and you want to save space on your Web page. Using checkboxes for a large number of items is not very user friendly. Using a list allows you to contain the items within a small box and still give the user full access to all of the choices through a scroll bar. You can also choose to have any one of the items in your list as the selected item when a form is loaded into the user’s browser. To do this, add the the selected attribute to the option you want selected.

< select name=”cars” size=”4″>
<option value=”audi”>Audi</option>
<option value=”dodge”>Dodge</option>
<option value=”toyota” selected>Toyota</option>
<option value=”vw”>Volkswagen</option>
</select>

A menu or a drop-down menu, is a drop-down box from which a user can choose only one item. When an item from a drop-down box is selected, the box disappears while displaying your selection. Similar to a radio button, a drop-down menu only allow you to make a single selection. Because we want the choices to drop down, either omit the size attribute or provide a value of zero or one.

< select name=”color” size=”0″>
<option value=”red”>Red</option>
<option value=”black”>Black</option>
<option value=”white”>White</option>
<option value=”blue”>Blue</option>
</select>

The w3.org’s explanation of forms.

A quick, concise tutorial on forms.

Today’s Objectives:

• Identify the different kinds of text boxes
• Explain the uses of radio buttons and checkboxes
• Place text boxes, radio buttons, and checkboxes in a Web page.

Classwork: Assignment 6-2.

Prep Questions:

• This input element allows:
  • Only one item to be selected
  • Multiple items to be selected
• If you want to have text pre-populate a textbox (because it is a common choice) how is this accomplished?