HTML Forms: Interacting with the User - Beginning JavaScript - page 362

You once again use the myForm.radCpuSpeed collection, retrieve the Radio object at index 0 , and set its
checked property to true . Let's take a moment and look at the findIndexOfSpeed() helper method.
It accepts a Radio object as an argument, and it searches the myForm.radCpuSpeed collection for the
given Radio object.
The first line of the function creates a variable called radios , and it contains a reference to the myForm
.radCpuSpeed collection. This is to make typing and reading a bit easier:
function findIndexOfSpeed(radio) {
var radios = myForm.radCpuSpeed;
Next, you want to loop through the radios collection and determine if each Radio object in the
collection is the same Radio object in the radio variable:
for (var index = 0; index < radios.length; index++) {
if (radios[index] == radio) {
return index;
}
}
return -1;
}
If you find a match, you return the value of the index variable. If the loop exits without finding
a match, you return ‐1 . This behavior is consistent with the String object's indexOf() method.
Consistency is a very good thing!
The next function, btnCheckClick() , executes when the standard button's click event fires. In a real
e‐commerce situation, this button would be the place where you'd check your form and then submit it
to the server for processing. Here you use the form to show a message box confirming which boxes you
have checked (as if you didn't already know)!
At the top you declare two local variables to use in the function. The variable numberOfControls is set
to the form's length property, which is the number of elements on the form. The variable compSpec is
used to build the string that you'll display in a message box:
function btnCheckClick() {
var numberOfControls = myForm.length;
var compSpec = "Your chosen processor speed is ";
In the following line, you add the value of the radio button the user has selected to your message
string:
compSpec = compSpec + findSelectedSpeedValue();
compSpec = compSpec + "\nWith the following additional components:\n";
You use yet another helper function called getSelectedSpeedValue() . As its name implies, it gets the
value of the selected Radio object. You'll look at its code later.
Next, you loop through the form's elements:
for (var index = 0; index < numberOfControls; index++) {
var element = myForm[index];