<input />

PURPOSE: To input the data into form. The types you can use are:
text, radio, checkbox, submit, reset, hidden and password. The radio and checkbox types can be always checked or be disabled and greyed out.

Below is a basic html document. The referenced html tag is in RED. All tags must have a start and a end tag. Most end tags have a / before the tags name, however there are a few that are done differently. The tags that end differently will be noted and highlighted. The order of the start and end tags is also very important to proper display of your page in a web browser.

TEXT BOX - The code and example for a text box:

<form method="post" action="mailto:somebody@somewhere.com" type="text/plain">
<p>
Your Name:<br />
<input type="text" name="name" size="27" /><br />
</p>
</form>

RADIO BUTTONS - Make sure to give the buttons the same name but a different value if you only want one choice to be able to be selected. Here's the code and example for radio buttons:

<form method="post" action="mailto:somebody@somewhere.com" type="text/plain">
<p>
How often do you visit my site?<br />
<input type="radio" name="visit" value="daily" />Every Day<br />
<input type="radio" name="visit" value="weekly" />Weekly<br />
</p>
</form>

To make a radio button remain checked, use the checked code:

<input type="radio" name="visit" value="daily" checked />Every Day
<input type="radio" name="visit" value="weekly" />Weekly

It produces this:

To make a radio button have a greyed out disc, use the disabled code: (does not work in some versions of Netscape)

<input type="radio" name="visit" value="daily" disabled />Every Day
<input type="radio" name="visit" value="weekly" />Weekly

It produces this:

CHECK BOXES - Make sure to give the boxes the same name but a different value if you only want one choice to be able to be selected. Here's the code and example for check boxes:

<form method="post" action="mailto:somebody@somewhere.com" type="text/plain">
<p>
Do you like my site?<br />
<input type="checkbox" name="like" value="yes" />Yes<br />
<input type="checkbox" name="like" value="no" />No<br />
</p>
</form>

To make a checkbox remain checked, use the checked code:

<input type="checkbox" name="like" value="yes" checked />Yes
<input type="checkbox" name="like" value="no" />No

To make a checkbox have a greyed out box, use the disabled code: (does not work in some versions of Netscape)

<input type="checkbox" name="like" value="yes" disabled />Yes
<input type="checkbox" name="like" value="no" />No

PASSWORD BOX - It only displays asterisks , no letters will show when typed in. The code and example for a password box:

<input type="password" size="8" maxlength="8" name="password" />

SUBMIT BUTTON - the code and a example.

<form method="post" action="mailto:somebody@somewhere.com" type="text/plain">
<input type="submit" value="Send" />
</form>

RESET BUTTON - the code and a example.

<form method="post" action="mailto:somebody@somewhere.com" type="text/plain">
<input type="reset" value="Reset" />
</form>

HIDDEN TEXT FIELDS

This field lists a form subject in the email results.
<input type="hidden" name="subject" value="Form Results /">

This field brings up a web page after the form is submitted.
<input type="hidden" name="next_url" value="http://www.somewhere.com/thanks.html /">

This field lists all the required fields that must be completed before the form will send itself. This example requires the user to fill in the areas containing their name and email address.
<input type="hidden" name="required_fields" value="name,email /">
</body>
</html>

© Copyright 2001,2002 Southern Twilight    All rights reserved.

Back To HTML Examples