<INPUT TYPE="radio" NAME="radioName" VALUE="buttonValue" [CHECKED] [onClick="handlerText"]> textToDisplay
1. radioName[index1].propertyName 2. radioName[index1].methodName(parameters) 3. formName.elements[index2].propertyName 4. formName.elements[index2].methodName(parameters)
Description
A radio object on a form looks as follows:
A radio object is a form element and must be defined within a FORM tag.
All radio buttons in a radio button group use the same name property. To access the individual radio buttons in your code, follow the object name with an index starting from zero, one for each button the same way you would for an array such as forms: document.forms[0].radioName[0] is the first, document.forms[0].radioName[1] is the second, and so on.
Properties
The radio object has the following properties:
Examples
Example 1. The following example defines a radio button group to choose among three music catalogs. Each radio button is given the same name, NAME="musicChoice," forming a group of buttons for which only one choice can be selected. The example also defines a text field that defaults to what was chosen via the radio buttons but that allows the user to type a nonstandard catalog name as well. The onClick event handler sets the catalog name input field when the user clicks a radio button.
<INPUT TYPE="text" NAME="catalog" SIZE="20">
<INPUT TYPE="radio" NAME="musicChoice" VALUE="soul-and-r&b"
onClick="musicForm.catalog.value = 'soul-and-r&b'"> Soul and R&B
<INPUT TYPE="radio" NAME="musicChoice" VALUE="jazz"
onClick="musicForm.catalog.value = 'jazz'"> Jazz
<INPUT TYPE="radio" NAME="musicChoice" VALUE="classical"
onClick="musicForm.catalog.value = 'classical'"> Classical
Example 2. The following example contains a form with three text boxes and three radio buttons. The radio buttons let the user choose whether the text fields are converted to uppercase or lowercase, or not converted at all. Each text field has an onChange event handler that converts the field value depending on which radio button is checked. The radio buttons for uppercase and lowercase have onClick event handlers that convert all fields when the user clicks the radio button.
<HTML>
<HEAD>
<TITLE>Radio object example</TITLE>
</HEAD>
<SCRIPT>
function convertField(field) {
if (document.form1.conversion[0].checked) {
field.value = field.value.toUpperCase()}
else {
if (document.form1.conversion[1].checked) {
field.value = field.value.toLowerCase()}
}
}
function convertAllFields(caseChange) {
if (caseChange=="upper") {
document.form1.lastName.value = document.form1.lastName.value.toUpperCase()
document.form1.firstName.value = document.form1.firstName.value.toUpperCase()
document.form1.cityName.value = document.form1.cityName.value.toUpperCase()}
else {
document.form1.lastName.value = document.form1.lastName.value.toLowerCase()
document.form1.firstName.value = document.form1.firstName.value.toLowerCase()
document.form1.cityName.value = document.form1.cityName.value.toLowerCase()
}
}
</SCRIPT>
<BODY>
<FORM NAME="form1">
<B>Last name:</B>
<INPUT TYPE="text" NAME="lastName" SIZE=20 onChange="convertField(this)">
<BR><B>First name:</B>
<INPUT TYPE="text" NAME="firstName" SIZE=20 onChange="convertField(this)">
<BR><B>City:</B>
<INPUT TYPE="text" NAME="cityName" SIZE=20 onChange="convertField(this)">
<P><B>Convert values to:</B>
<BR><INPUT TYPE="radio" NAME="conversion" VALUE="upper"
onClick="if (this.checked) {convertAllFields('upper')}"> Upper case
<BR><INPUT TYPE="radio" NAME="conversion" VALUE="lower"
onClick="if (this.checked) {convertAllFields('lower')}"> Lower case
<BR><INPUT TYPE="radio" NAME="conversion" VALUE="noChange"> No conversion
</FORM>
</BODY>
</HTML>
See also the example for the link object.
See also
checkbox object, form object, select object
random
Method. Returns a pseudo-random number between zero and one. This method is available on Unix platforms only.
Syntax
Math.random()
Method of
Math
Examples
//Returns a random number between 0 and 1
function getRandom() {
return Math.random()
}
referrer
Property. Specifies the URL of the calling document when a user clicks a link.
Syntax
document.referrer
Property of
document
Description
When a user navigates to a destination document by clicking a link object on a source document, the referrer property contains the URL of the source document. Evaluate the referrer property from the destination document.
referrer is a read-only property.
Examples
In the following example, the getReferrer function is called from the destination document. It returns the URL of the source document.
function getReferrer() {
return document.referrer
}
reset
Object. A reset button on an HTML form. A reset button resets all elements in a form to their defaults.
HTML syntax
To define a reset button, use standard HTML syntax with the addition of the onClick event handler:
<INPUT
TYPE="reset"
NAME="resetName"
VALUE="buttonText"
[onClick="handlerText"]>
HTML attributes
NAME="resetName" specifies the name of the reset object. You can access this value using the name property.
VALUE="buttonText" specifies the text to display on the button face. You can access this value using the value property.
Syntax
To use a reset object's properties and methods:
1. resetName.propertyName
2. resetName.methodName(parameters)
3. formName.elements[index].propertyName
4. formName.elements[index].methodName(parameters)
Parameters
resetName is the value of the NAME attribute of a reset object.
formName is either the value of the NAME attribute of a form object or an element in the forms array.
index is an integer representing a reset object on a form.
propertyName is one of the properties listed below.
methodName is one of the methods listed below.
Property of
form
Description
A reset object on a form looks as follows:
A reset object is a form element and must be defined within a FORM tag.
The reset button's onClick event handler cannot prevent a form from being reset; once the button is clicked, the reset cannot be canceled.
Properties
The reset object has the following properties:
| Property | Description |
|---|---|
| name | Reflects the NAME attribute |
| value | Reflects the VALUE attribute |
Examples
Example 1. The following example displays a text object with the default value "CA" and a reset button with the text "Clear Form" displayed on its face. If the user types a state abbreviation in the text object and then clicks the Clear Form button, the original value of "CA" is restored.
<B>State: </B><INPUT TYPE="text" NAME="state" VALUE="CA" SIZE="2">
<P><INPUT TYPE="reset" VALUE="Clear Form">
Example 2. The following example displays two text objects, a select object, and three radio buttons; all of these objects have default values. The form also has a reset button with the text "Defaults" on its face. If the user changes the value of any of the objects and then clicks the Defaults button, the original values are restored.
<HTML>
<HEAD>
<TITLE>Reset object example</TITLE>
</HEAD>
<BODY>
<FORM NAME="form1">
<BR><B>City: </B><INPUT TYPE="text" NAME="city" VALUE="Santa Cruz" SIZE="20">
<B>State: </B><INPUT TYPE="text" NAME="state" VALUE="CA" SIZE="2">
<P><SELECT NAME="colorChoice">
<OPTION SELECTED> Blue
<OPTION> Yellow
<OPTION> Green
<OPTION> Red
</SELECT>
<P><INPUT TYPE="radio" NAME="musicChoice" VALUE="soul-and-r&b"
CHECKED> Soul and R&B
<BR><INPUT TYPE="radio" NAME="musicChoice" VALUE="jazz">
Jazz
<BR><INPUT TYPE="radio" NAME="musicChoice" VALUE="classical">
Classical
<P><INPUT TYPE="reset" VALUE="Defaults" NAME="reset1">
</FORM>
</BODY>
</HTML>
See also
button object, form object, submit object
round
Method. Returns the value of a number rounded to the nearest integer.
Syntax
Math.round(number)
Parameters
number is any numeric expression or a property of an existing object.
Method of
Math
Description
If the fractional portion of number is .5 or greater, the argument is rounded to the next highest integer. If the fractional portion of number is less than .5, the argument is rounded to the next lowest integer.
Examples
//Displays the value 20
document.write("The rounded value is " + Math.round(20.49))
//Displays the value 21
document.write("<P>The rounded value is " + Math.round(20.5))
//Displays the value -20
document.write("<P>The rounded value is " + Math.round(-20.5))
//Displays the value -21
document.write("<P>The rounded value is " + Math.round(-20.51))
In LiveWire, you can display the same output by calling the write function instead of using document.write.