document.getElementById not working in Opera

Hi all,
i have an array of checkboxes and i have Check All | Uncheck All links which on click will check all or unchecks all the checkboxes.

Following is the checkbox:

<input type="checkbox" id="Item_ID[]" name="Item_ID[<?=$key?>]" <?=$checked?> value="<?=$iarr['pk']?>">
following is the link code and javascript :
<a href='' onclick="setCheckboxes(true) ; return false;"> Check All</a> <br> <a href='' onclick="setCheckboxes(false); return false;"> Uncheck All</a>

<script language="javascript">


function setCheckboxes(do_check)
{

var elts= document.getElementById('Item_ID[]');
// alert(elts);
elts_cnt = elts.length;
// alert(elts_cnt);
if (elts_cnt>0) {
for (var i = 0; i < elts_cnt; i++) {

elts[i].checked = do_check;
} // end for
} else {
elts.checked = do_check;
} // end if... else

return true;
} // end of the 'setCheckboxes()' function

</script>

But the above script doesnt work in Opera :confused:. it works fine in IE. how can i modify the script to make it work in all the browsers. i cannot change the name or id of the checkboxes.

Thanks in advance

I believe [ and ] are invalid characters for id. Just validate your code and correct all markup errors first, to correct your javascript

Only a single element on a single page may have any given ID. If you have more than one element with the same ID, you should not expect getElementById to work at all.

In this example, you are taking the result of getElementById and treat it as if it was a NodeList - it's not, that's in fact a browser bug. The getElementById method should always return a single Element. If your document does not make sure that there is only a single element with any given ID, then that is a broken document, but Opera does actually work perfectly fine as expected, in difference to Internet Explorer in this case. (If you're expecting Opera to have the Internet Explorer behaviour, then it's your expectation that needs to be corrected, because that's not the way things are meant to work.)




But the above script doesnt work in Opera :confused:. it works fine in IE. how can i modify the script to make it work in all the browsers. i cannot change the name or id of the checkboxes.I'm sorry, but that attitude is really bad. Why? Because the correct way to fix your problem is to first make sure you never have more than a single element with the same ID. (Also, neither [ nor ] is allowed in an ID.)

Second, if you want a NodeList of form controls (in this case checkboxes or radio buttons) that belong together, then you give all those elements the same name.



That's the rules of the game. If you don't want to play by them, then you find yourself with scripts that never were meant to work the way they do, they just incidentally happen to play to some browser bugs in certain browsers which allow them to work in that particular browser.

hi liorean,
thanks for your advice. i changed the ids and now its working fine. :thumbsup:

<input type="checkbox" id="Item_ID_<?=$key?>" name="Item_ID[<?=$key?>]" <?=$checked?> value="<?=$iarr['pk']?>">

what you say is absolutely right. ID's are meant to be unique