HTML and CSS Reference
In-Depth Information
EXAMPLE 11.4 ( CONTINUED )
5
<script type="text/javascript">
6
var rb1=document.getElementById("rbutton1");
var rb2=document.getElementById("rbutton2");
var rb3=document.getElementById("rbutton3");
7
document.write("Using the id Attribute:<br />");
document.write(rb1.value+"<br />");
document.write(rb2.value+"<br />");
document.write(rb3.value+"<br />");
</script>
</big>
</body>
</html>
EXPLANATION
1
The form is an object. It has a name and an ID. When this form is submitted, it
will use the GET method to send the data to the Web server. You will be able to
see the input data as name/value pairs right in the location box of your browser,
the name of the input device being the key and the user input, the value.
2
The input type is a radio button. The name for all radio buttons is the same for all
the buttons because only one button can be selected by the user. But the id attri-
bute must be unique. Therefore, each radio button has the same name but a dif-
ferent ID. If input data is going to be sent to a server program, the name attribute
is necessary to create the name/value pairs. If the input data is going to be used by
JavaScript then the getElementById() method can use the unique value to get a ref-
erence to the input device.
3
When the submit button is selected, the data input by the user is collected in
name/value pairs and sent by the browser to the server.
4
The HTML form ends here.
5
In the following script, JavaScript utilizes the id attribute to access the data for
each of the radio buttons.
6
The getElementById() method returns a reference to the first radio button by using
its unique id . The variable rb1 contains the reference.
7
Once you have a reference to the button, you can use its properties with the dot
syntax.
Search WWH ::




Custom Search