The Form
is a JavaScript user's best friend. Forms can be used to input text, to display results, and to trigger JavaScript functions. The form in our example used 2 objects, a text box
, and a button
.
All forms
start with the tag <FORM>
and end with </FORM>
.
The text box
should include a NAME
and a TYPE
- The
NAME
will be used when we need to tell the function which box has the text we want. TYPE
is how the browser knows to create a text box, button, or check box.
For example:
<INPUTNAME="text1" TYPE=Text>
The button
is how we tell JavaScript to run a particular function. The button should include a NAME
, TYPE
, VALUE
, and ONCLICK
command
- The NAME could be used to refer to the button in JavaScript, but is usually not important.
- The VALUE is the label which will appear inside the button.
- The ONCLICK is followed by the name of a function, and the name of the text box containing the data.
For example:
<INPUT NAME="submit" TYPE=Button VALUE="Show Me" onClick="MsgBox ( form.text1.value )" >
<BODY>
<FORM>
<INPUT NAME="text1" TYPE=Text>
<INPUT NAME="submit" TYPE=Button VALUE="Show Me" onClick="MsgBox(form.text1.value)">
</FORM>
</BODY>
</HTML>
We ended the description of the form button with:
onClick="MsgBox(form.text1.value)"
This means when the user clicks on this button, the program should run the MsgBox
function from the top of the page, and use thevalueof theformobject namedtext1as its variable.
huh?
OK, there are 2 objects in the form, a text box
and a button
, right? Each object has a name, and the text box is named text1
. The text box's full name is form.text1
. The number of characters typed in the box is called form.text1.length
. The value, or string of text that was typed is called form.text1.value
If this is getting too jargon-ish for you, just remember that you end your "submit" button withonClick=function(form.textboxname.value)
where function
and textbox
name will be substituted.