Forms enable us to automate the sending and recieving of data enabling us to do a number of things such as login to servers, send web based emails, sign guest books, use drop down combo boxes etc.
- <FORM></FORM> - Declare Form. To declare a form we use the FORM tag.
- <FORM ACTION="url "> - Form Action. To process most forms you need a script. The url of this script is to be specified as the action for the form to work. A Form without a script is usually a small one with a built in JavaScript Function (like the 2nd example below).
- <FORM METHOD="***"> - Method of Action. Also required for most forms to work is a method. By specifying METHOD="POST, GET" you are telling the script what to do with the information it gets. You would use POST for forms that require you to enter in data to be able to go somewhere or send it somewhere (eg. logging in), wheras GET would be used when requiring the script to send specific information back to you (eg searching).
- <INPUT> - Form Field Input. Form Inputs must be place within the FORM tags and define that there is to be an input.
- <INPUT TYPE="***"> - Input Type. There are a number of different input types: TEXT, PASSWORD, CHECKBOX, RADIO, FILE, BUTTON, IMAGE, HIDDEN, SUBMIT, RESET the most common beign the first 2. The different input types are used to send different data types (eg. text,boolean) and there may be more than 1 input per form.
- <INPUT NAME="***"> - Input Name. Each input should have a name, as it is usually used as the variable name within the script.
- <INPUT VALUE="***"> - Input Value. The Value of an input is the data that is displayed when the page the form is on, is loaded. Ie. the default text in a text input etc.
- <INPUT SIZE="?"> - Size Of Input. The Size of an input is basically its width. Usually defined in terms of characters however different character sets appear to have no effect on the input size.
- <INPUT MAXLENGTH="?"> - Maximum Input Length. The maximum number of characters allowed to be typed in.
- <INPUT CHECKED> - Check Input. Used with CHECKBOX and RADIO inputs, it shows it as already checked.
- <BUTTON> - Form Button. The same as any other button, a form button looks like a button and looks depressed when clicked. A button is basically another input but it has its own set of attributes.
- <BUTTON TYPE="***"> - Type of Button. The type of button determines what the button is to do when pressed. The main button types are SUBMIT, RESETwhich submits the form data or clears all the input fields respectively.
- <BUTTON NAME="***"> - Button Name. As before - the name given to the input which takes the form of a button.
- <BUTTON VALUE="***"> - Button Text. The button value is the text that appears on the button.
- <BUTTON SIZE="?"> - Button Size. The length (width) of the button.
- <SELECT></SELECT> - Form Selector. An input containing a number of options which you can select.
- <SELECT NAME="***"> - Selector Name. Name of the selector.
- <SELECT SIZE="?"> - Number of Selector Items. The size of a selector defines the number of lines of options it is to display - thin results in a list box format being used. If the number of options remains unspecfied, a drop-down menu (combs box) is used.
- <SELECT MULTIPLE> - Allow Multple Selections. This is used mainly with the list box format - allowing the user to scroll up and down the.
- <OPTION></OPTION> - Selectable Option. The text for each option to be selectable it has to be surrounded by the OPTION Tag.
- <OPTION SELECTED> - Set to Default Option. The Default option is the one displayed in the selection box when it loads up.
- <OPTION VALUE="***"> - Option Value. The value of an option is used within the script. When an item s selected, its value is passed as a variable to the script which then processes it. For example, the values of the options in the 2nd example below are all url's and the script (a simple javascript) checks the value and links to the url specified.
- <TEXTAREA></TEXTAREA> - Text Area Input. This is an input that allows a large amount of text to be input, and allows the input box to be a specified size.
- <TEXTAREA NAME="***"> - Name Of Text Area. The name assigned to the text area input.
- <TEXTAREA ROWS="?"> - Number of Text Rows. The vertical size of the text area, defined as a number of rows of text.
- <TEXTAREA COLS="?"> - Number of Columns. The horizontal size of the text box defined as a number of characters.
Example 1:
A login form for hotmail using a script on their server and a number of inputs. Note: by the time you use this it may be outdated as hotmail change the address of the server or the info required quite regularly.
Example 2:
A Drop Down Combo Box (Choice Box in Java) using a custom JavaScript to go to the selected location
| Prev | Top | Next |
http://htmlguide.drgrog.com/alpha/ |
Copyright © 1999 Robert Duncan |