Chapter 14: Forms Continued

Pull Down and Scrolling Lists

The next type of input is a Pull Down List. With this type you use <SELECT> instead of <INPUT> and it has a closing tag.

<SELECT>
</SELECT>


Don't forget to give it a name.

<SELECT NAME="POSITION">
</SELECT>


Next add a few options.

<SELECT NAME="POSITION">
<OPTION>Powerbuilder Developer
<OPTION>Database Administrator
<OPTION>None of the above
</SELECT>


And give each <OPTION> a VALUE.

<SELECT NAME="POSITION">
<OPTION VALUE="PB">Powerbuilder Developer
<OPTION VALUE="DBA">Database Administrator
<OPTION VALUE="NOTA">None of the above
</SELECT>

The default option is the one that is listed first.


We can specify a default other than the first option in the list.

<SELECT NAME="POSITION">
<OPTION VALUE="PB">Powerbuilder Developer
<OPTION VALUE="DBA" SELECTED>Database Administrator
<OPTION VALUE="NOTA">None of the above
</SELECT>


A Scrolling List is very similar in construction to a Pull Down List. We'll add a few more options first. Then, all we do to turn it into a Scrolling List is add a SIZE attribute to the <SELECT> tag.

<SELECT NAME="POSITION" SIZE=4>
<OPTION VALUE="PB">Powerbuilder Developer
<OPTION VALUE="DBA">Database Administrator
<OPTION VALUE="VB">Visual Basic Developer
<OPTION VALUE="ADMIN">Administration staff
<OPTION VALUE="JANITOR">Janitor
<OPTION VALUE="NOTA">None of the above
</SELECT>

The SIZE is simply how many options show in the window.


Again, the default value is the first <OPTION>, and again we can change that by selecting one.

<SELECT NAME="POSITION" SIZE=4>
<OPTION VALUE="PB">Powerbuilder Developer
<OPTION VALUE="DBA" SELECTED>Database Administrator
<OPTION VALUE="VB">Visual Basic Developer
<OPTION VALUE="ADMIN">Administration staff
<OPTION VALUE="JANITOR">Janitor
<OPTION VALUE="NOTA">None of the above
</SELECT>


Textarea

A very useful type of input is <TEXTAREA>.

<TEXTAREA NAME="COMMENTS">
</TEXTAREA>


You control the size of the box like so...

<TEXTAREA NAME="COMMENTS" ROWS=6 COLS=50>
</TEXTAREA>

ROWS is the height, COLS is the width.




A good attribute to include in <TEXTAREA> is WRAP. Some browsers do not understand it, but if that's the case, they will just ignore it.

Go ahead and type in the boxes...

<TEXTAREA NAME="COMMENTS" ROWS=3 COLS=30 WRAP=VIRTUAL>
</TEXTAREA>

WRAP=VIRTUAL means that the text in the box wraps, but it is sent as one long continuous string.


<TEXTAREA NAME="COMMENTS" ROWS=3 COLS=30 WRAP=PHYSICAL>
</TEXTAREA>

WRAP=PHYSICAL means that the text in the box wraps, and it is sent that way too.


<TEXTAREA NAME="COMMENTS" ROWS=3 COLS=30 WRAP=OFF>
</TEXTAREA>

This is the default.
WRAP=OFF means that the text in the box does not wrap, but it is sent exactly the way it was typed in (like the little man a few textareas back).




Your own HTML page...

Open the page "feedback.htm" in Notepad, and add the following (the blue text is what to add).

<html>
<body background="bgnd.gif">

<center><h1>Feedback Form</h1></center>
<br>
<form>
<b>My name is: </b><input type=text name="name">
<p>
<b>I work as a:</b><br>
.
.
</p>
<p>
<b>When it comes to web browsers:</b><br>
.
.
</p>

<b>I rate your site as:</b><br>
<select name="Rating">
<option value="Wow">Wow! How did you do it?
<option value="good">Really good
<option value="interesting">Interesting
<option value="hmmm">Hmmm - seen better
<option value="tryagain">Try again bud!
</select>
</p>
<p>
<b>Comments:</b><br>
<textarea name="comments" rows="6" cols="50" wrap="physical">
</textarea>
</p>
</body>
</html>


Save the file.

Go To Chapter 15

Free Credit Reports
Free DMV Links
Free Real Estate Forms
Free Secret Info Page
Free Crime Protection
Free Legal Forms
Free Classified Links
Free Auction Site Links
Free Business Forms
Free Government Programs
Free Web Business Ideas
Free Real Estate Reports
Free HTML Tutorial
Free Software Sources
Free Business Reports
Free Real Estate Glossary
Free Web Art
Car Tips