getElementsByName returns undefined
Question
This is my javascript:
<script type="text/javascript">
var crct_answrs = new Array(<?php echo implode(',', $crct_ans); ?>);
var answrs = new Array();
function check_ans(){
for(var i = 1; i < 11; i++){
var tst = "ques"+i;
var radio = document.getElementsByName(tst);
for (var x = 0; x < radio.length; x ++) {
if (radio[x].checked) {
answrs = radio.value;
}
}
}
}
</script>
This is part of HTML:
<form>
<div id="quest1" class="question">
<div class="prblm">
<?php echo $questions[1]; ?></div>
<table class="answrs">
<tr>
<td><?php echo $answrs[1][1]; ?></td>
<td><input name="ques1" type="radio" value="1"></td>
</tr>
<tr>
<td><?php echo $answrs[1][2]; ?></td>
<td><input name="ques1" type="radio" value="2"></td>
</tr>
<tr>
<td><?php echo $answrs[1][3]; ?></td>
<td><input name="ques1" type="radio" value="3"></td>
</tr>
<tr>
<td><?php echo $answrs[1][4]; ?></td>
<td><input name="ques1" type="radio" value="4"></td>
</tr>
</table>
</div>
I have 10 same pattern div tags with tables and the input name is change accordingly. check_ans() runs on onclick . But all the time getElementsByName returns undefined. Why this happens. Please help me. Thanks!
3 answers
solution1
3 ACCPTED 2012-04-23 21:18:09
Your error lies in:
if (radio[x].checked) {
answrs = radio.value;
}
answrs is an array and needs to set values to the index of the corresponding iterator it's on. radio.value is trying to access value from the radio array, but has left out it's index as well. Look at my solution below for the fix:
I've got a jsFiddle working.
JavaScript:
var answrs = [];
function check_ans() {
for (var i = 1; i <= 10; i++) {
var radio = document.getElementsByName("ques" + i);
for (var x = 0; x < radio.length; x++) {
if (radio[x].checked) {
answrs[i-1] = radio[x].value;
}
}
}
console.log(answrs);
}
Output:
When selecting an answer 1, 2, 3, 4, 3, 2, 1, 2, 3, 4 for questions 1-10 the array is:
["1", "2", "3", "4", "3", "2", "1", "2", "3", "4"]
solution2
0 2012-04-23 21:19:37
Hmmm. This worked for me (I've removed some PHP code)
<html>
<head>
<script type="text/javascript">
var crct_answrs = new Array();
var answrs = new Array();
function check_ans(){
for(var i = 1; i < 11; i++){
var tst = "ques"+i;
var radio = document.getElementsByName(tst);
alert(radio);
for (var x = 0; x < radio.length; x ++) {
if (radio[x].checked) {
answrs = radio.value;
}
}
}
}
</script>
</head>
<body>
<button type="button" onclick="check_ans();">test</button>
<div id="quest1" class="question">
<div class="prblm">
<?php echo $questions[1]; ?></div>
<table class="answrs">
<tr>
<td><?php echo $answrs[1][1]; ?></td>
<td><input name="ques1" type="radio" value="1"></td>
</tr>
<tr>
<td><?php echo $answrs[1][2]; ?></td>
<td><input name="ques1" type="radio" value="2"></td>
</tr>
<tr>
<td><?php echo $answrs[1][3]; ?></td>
<td><input name="ques1" type="radio" value="3"></td>
</tr>
<tr>
<td><?php echo $answrs[1][4]; ?></td>
<td><input name="ques1" type="radio" value="4"></td>
</tr>
</table>
</div>
<body/>
</html>
Any differences from your code? alert call shows values.
solution3
-1 2012-06-20 20:50:28
I sometimes get an undefined var assigned to document.getElementsByName(name) .
So I would try to see if any answers from the web would help. Alas, nothing worked.
So I went ahead and tested the array I thought I should be getting. and the elements were there. So just ignore the 'undefined' and proceed working with the var.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.