JavaScript Kit > JavaScript Reference > Here
Radio Object
Radio buttons (<input type="radio">) within your form can be accessed and manipulated using JavaScript via the corresponding Radio object. There are two ways to access a radio button, depending on whether it it unique in the form (distinct name), or part of a group of radio buttons, all sharing the same name.
Distinct Name:
document.myform.radioname //where myform and radioname are
names of your form/element.
document.myform.elements[i] //where i is the position of the radio button within form
Shared Names (part of a group of radio buttons):
document.myform.radioname[i] //where i is the position of the radio within the group of radio buttons.
Related Tutorials
Events
| Events | Description |
|---|---|
| onBlur | Code is executed when the focus is removed from the radio button. |
| onClick | Code is executed when user clicks on the radio button. |
| onFocus | Code is executed when the focus is set on the radio button. |
Properties
| Properties | Description |
|---|---|
| checked | Boolean property that reflects the current state of the radio button, "true" if it's checked, and "false" if not. Example(s). |
| defaultChecked | Boolean property that reflects the value of the CHECKED attribute. |
| form | References the form that contains the radio button. |
| name | Reflects the name of the radio button (the name attribute). |
| type | A property available on all form elements, "type" returns the type of the calling form element, in this case, "radio". |
| value | A read/write string that specifies the value of the radio button (the value attribute). |
Methods
| Methods | Description |
|---|---|
| blur() | Removes focus away from the radio button. |
| click() | Simulates a user clicking on the radio button. |
| focus() | Sets focus on the radio button. |
Examples
checked
This example loops through a group of radio buttons all sharing the same name, and returns the index number of the one that's checked:
<form name="test">
<input type="radio" name="myradio" />
<input type="radio" name="myradio" checked />
<input type="radio" name="myradio" />
</form>
<script type="text/javascript">
//a variable that will hold the index number of the selected radio button
for (i=0;i<document.test.myradio.length;i++){
if (document.test.myradio[i].checked==true)
theone=i
}
</script>
- JavaScript Operators
- JavaScript Statements
- Global functions
- JavaScript Events
- Escape Sequences
- Reserved Words