forms project

main idea

• First, in class we'll learn to make a simple form in html.

• Then we'll do the same things in Dreamweaver.

• We'll learn how to make a form "work" on Geocities so that you get the results you request.

• Finally, you'll demonstrate your knowledge of forms by making an original form, uploading it to your web site, and having (ten) people fill it out. You can require information about anything, but you should have six of the form objects described below.

The form tag

Before you can do anything you need to have a form tag on your page. It goes like this:

<form method=post name="some_name" action="http://geocities.yahoo.com/forms?login=your_id">

and, of course, at the end you need to close your form tag:

</form>

insert text field

Please enter your first name below:

code: <input type="text" name="thename">

This allows you to put a text box on the page to be filled out by the visitor. You can set the size and choose default text, if you like, by adding "size=the number of characters" and "value=the default text"

multiline text fields

<textarea name="textfield2" cols="40" rows="5">This is the default text for the text area.</textarea>

You can define a larger area for text input with the <textarea> tag. The columns are the number of characters across; the rows the number of lines down. You do not have to have default text.

Check boxes

<input type="checkbox" name="checkbox" value="checkbox">
web design<br>

Checkboxes are handy for yes/no choices and on/off values. You can define them using the <input type="checkbox"> tag. You can, as you can see, check options by default. People may check more than one of the boxes; this is not true of radio buttons.

radio buttons

<input type="radio" name="least" value="web">web design<br>

Radio buttons are similar to checkboxes, but you can only choose one option withion each group of buttons. You define the buttons with the <input type="radio"> tag. To make all the button one group, give them the same name. You can make one of the buttons the default selection. You can have more than one group of radio buttons within a form.

drop-down selections

My all-time favorite losers are

 

<select name="losers">
<option value="Red Sox" selected>Boston Red Sox</option>
<option value="Cubs">Chicago Cubs</option>
<option value="Patriots">N.E. Patriots</option>
<option value="Anna">Anna Kornikova</option>
</select>

Besides check boxes and radio buttons, another way to give your visitor a choice is with a drop-down or selection list. You use the <select> </select> tags to define a list with two or more <option> tags in between. You can use this basic format to create a jump menu of links, as in the next example. As you can see, you can have a default selection.

 

a jump menu

This is easily accomplished in Dreamweaver using the "jump menu" icon. You just input the link text and url in the dialogue box. It would require knowing some JavaScript to do it in html.

buttons

<input type="submit" name="Submit" value="Submit">

Buttons are often used to submit a form's contents or to reset or clears all of the field in the current form. The generic "button" doesn't do anything unless you use JavaScript to perform an action.

options

• You can also add hidden fields, a browse button, or an image to your form.

• You can use free polls, guest books, and form add-ons supplied by many web hosts.

• You can collect form data via email (method="post") or learn to use the CGI provided by some web hosts to gather and tabulate data.

forms hosting

response-o-matic

There are services such as the one recommended by your book which will help you make your form and will process it and send you the results as an e-mail. You can also see what's available from your web host:

angelfire | tripod | webmonkey tutorial on forms