| Here is a form element: | Here's the HTML which made it: |
|---|---|
| <form action="/cgi-bin/echo_form.cgi" method="post"> | |
|
(A submit button) |
<input type="submit" name="sendit" value="Send the Form" /> |
|
(A reset button) |
<input type="reset" name="clearit" value="Reset the Form" /> |
| Course Name (A basic text input) |
Course Name: <input type="text" size="10" maxlength="24" name="Course" value="IT 280" /> |
|
(A password field - the value is replaced by asterisks on the rendered page.) |
<input type="password" name="passwd" value= "Secret Password" /> |
|
(A hidden field - it does not show anything on the rendered page.) |
<input type="hidden" name="secret" value="Find me!" /> |
| Class: Undergrad Graduate Other (Radio buttons that have the same name form a group. Only one can be selected.) |
Class: <input type="radio" name="level" value="UG" /> Undergrad<br> <input type="radio" name="level" value="Gr" checked="checked" /> Graduate <input type="radio" name="level" value="Oth" /> Other |
| Course Benefit Learning a lot Having fun! Earning 3 credits (Checkboxes that have the same name form a group. More than one can be selected.) |
Course Benefit <input type="checkbox" name="bennie" value="learn" checked="checked />Learning a Lot <input type="checkbox" name="bennie" value="fun" />Having fun! <input type="checkbox" name="bennie" value="credit" />Earning 3 credits |
| Month (A selection list functions the same as a radio group. Only one option can be selected. If the value is not provided for an option, the text will be used.) |
Month <select name="month"> <option value="1">January</option> <option value="2">February</option> <option value="3" selected>March</option> <option value="4">April</option> <option value="5">May</option> </select> |
| Favorite Teams: (A multiple selection list (scrolling menu) functions the same as a checkbox group. More than one option can be selected. If the value is not provided for an option, the text will be used.) |
Favorite Teams: <select name="teams" multiple="multiple" size="3"> <option>Alyssum</option> <option>Balsam</option> <option>Begonia</option> <option>Coleus</option> <option>Hibiscus</option> <option>Magnolia</option> </select> |
| Comments: (A textarea lets the user type multiple lines of text, including spaces and line breaks.) |
Comments: <textarea name="comments" rows="5" cols="25"> Your comments </textarea> |
| (The end of the form) |
</form> |