[ACCEPTED]-How do I get the text of a radio button (not the value)-input
It doesn't work because there is no such 3 thing as text inside an <input> like that -- that's 2 illegal in XHTML. It must be:
<input type="radio" name="colors" value="red" id="radio1" checked="checked" /><label for="radio1">apple</label>
Then you can 1 look for the text inside the <label>.
elem.nextSibling.nodeValue.replace('\n', '')
The replace is to get rid of the newline 3 (may be different on different OSes, I am 2 running Windows) character which is there 1 for some reason.
<form id="myForm">
<ul>
<li><input type="radio" name="colors" value="red">apple</li>
<li><input type="radio" name="colors" value="blue">sky</li>
<li><input type="radio" name="colors" value="green">grass</li>
</ul>
</form>
<script>
(function(){
var form = document.getElementById("myForm");
var colorFields = form.elements["colors"];
alert(colorFields[0].nextSibling.data); //alerts the text apple not the value red.
});
0
I added this answer because previously there 6 was no full solution to the question.
Below 5 code uses two prototype functions from the 4 Array object:
forEachto add click event listener 3 for each radio nodefilterto retrieve checked 2 radio node
as the RadioNodeList does not 1 have those functionalities build-in.
var rblist = document.getElementsByName("colors");;
[].forEach.call(rblist, function(e) {
e.addEventListener('click', showText, false)
});
function showText() {
var rb = [].filter.call(rblist, function(e) {
return e.checked;
})[0];
console.log(rb.nextElementSibling.innerText);
};<input type="radio" name="colors" value="red" /><label>apple</label>
<input type="radio" name="colors" value="blue" /><label>sky</label>
<input type="radio" name="colors" value="green" /><label>grass</label>More Related questions
We use cookies to improve the performance of the site. By staying on our site, you agree to the terms of use of cookies.