Radio nameProperty
Radio Object
Definition and Usage
The name property sets or returns the name of the radio button.
Tip:Radio button groups are defined using the name property (radio buttons with the same name belong to the same group).
The name property is used to send data to the server after form submission, or to reference form data in JavaScript.
Note:After form submission, only the name attribute of a form element passes data values.
Syntax
Set the name property:
radioObject.name="name"
Return the name property:
radioObject.name
Browser Support
All major browsers support the name property.
Example
Example
Display the name property value of the "Red" radio button:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Rookie Tutorial (example.com)</title>
<script>
function displayResult(){
var x=document.getElementById("red").name;
alert(x);
}
</script>
</head>
<body>
<form>
Which color do you prefer?<br>
<input type="radio" name="colors" id="red">Red<br>
<input type="radio" name="colors" id="blue">Blue<br>
<input type="radio" name="colors" id="green">Green
</form>
<button type="button" onclick="displayResult()">Show the name of the red radio button</button>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>Rookie Tutorial (example.com)</title>
<script>
function displayResult(){
var x=document.getElementById("red").name;
alert(x);
}
</script>
</head>
<body>
<form>
Which color do you prefer?<br>
<input type="radio" name="colors" id="red">Red<br>
<input type="radio" name="colors" id="blue">Blue<br>
<input type="radio" name="colors" id="green">Green
</form>
<button type="button" onclick="displayResult()">Show the name of the red radio button</button>
</body>
</html>
Try it Yourself »
Radio Object Other Extensions