HTML, CSS, and JavaScript Mobile Development For Dummies by William Harrel

Author:William Harrel
Language: eng
Format: epub, pdf
Publisher: For Dummies
Published: 2011-08-09T16:00:00+00:00

Select menus and lists use the <select></select> tag pair, and the list options are placed between the <option></option> tag pair, like this.

<select name=”month”>

<option value=”1”>January</option>

<option value=”2”>February</option>

<option value=”3”>March</option>

<option value=”4”>April</option>

<option value=”5”>May</option>

<option value=”6”>June</option>

<option value=”7”>July</option>

<option value=”8”>August</option>

<option value=”9”>September</option>

<option value=”10”>October</option>

<option value=”11”>November</option>

<option value=”12”>December</option>

</select>

The value between the quotation marks is the value this list submits, and the value between the tags is what the user sees. The example just given sets up a drop-down menu. To change from a drop-down to a display list, you simply add the size attribute to the select tag, like this:

<select name=”month” size=”4”>

<option value=”1”>January</option>

<option value=”2”>February</option>

<option value=”3”>March</option>

<option value=”4”>April</option>

<option value=”5”>May</option>

<option value=”6”>June</option>

<option value=”7”>July</option>

<option value=”8”>August</option>

<option value=”9”>September</option>

<option value=”10”>October</option>

<option value=”11”>November</option>

<option value=”12”>December</option>

</select>

The preceding code would create a display list with the first four options displayed, and the remaining options are scrollable. To display the entire list, simply set the size value to number of options. In the above example, the size value would be 12.

Drop-down lists or display lists?

There are several very good reasons for using select lists over text fields. Forcing the user to choose from a list controls how the data gets submitted — and there are all kinds of applications where controlling what the form sends is beneficial. Say, for instance, you're collecting addresses in a database. Forcing the user to choose his state from a list ensures that you don't get a few thousand variations of Mississippi in your database. Using lists to control how dates are sent also saves you from having to sort out umpteen date format versions.

I'm sure you get the idea. There are thousands of ways users can mangle your data collection. Yet another benefit of select lists is that the value sent by the form can be different from what the user selects. Why is this beneficial? Let me give you an example; then, I'm sure, many more reasons will occur to you: Say your company collects customer information based on regions: Southeast, Midwest, and so on. Would you rather your user decides which state falls into what region, or would you rather he or she chooses a state and you — or you select list — decides which region the state is in? For your data collection purposes, North Carolina might be in the Southeast. The person filling out the form may not see it that way. Or maybe you just want to present the user with the names of months, but want them submitted as numbers.

Finally, should you use drop-downs or display lists? This depends on your application and how you want your form to look, of course. If your lists are very long, such as countries or states, for example, the drop-down menu or partial display list saves gobs of screen space — and frankly, they're much more attractive and professional-looking. A rule of thumb I use is: two or three list options go in a display list; more than three go in a drop-down.

Download

Copyright Disclaimer:
This site does not store any files on its server. We only index and link to content provided by other sites. Please contact the content providers to delete copyright contents if any and email us, we'll remove relevant links or contents immediately.