Checking if at east 1 checkbox is selected in an array of checkboxes

JavaScript
1

I have an array of checkboxes:


<input type="checkbox" name="sel[]" value="1" id="sel">
....
<input type="checkbox" name="sel[]" value="1" id="sel">

I want to create a javascript function that checks to make sure at least one is selected, if not the form doesn’t submit.

So I created the javascript function that is called on the OnSubmit, however my javascript function can not work out the length of the array to loop through and check each item if checked.

Can somebody please help.
I have tried:
document.formname.sel.length (doesn’t work)
document.getElementById(“sel”).length and that doesn’t work either.

This is my current, non working code:


function CheckForm(){
	var checked=false;
	var element = document.getElementById("sel");

	for(var i=0; i < element.length; i++){
	if(element[i].checked)
		checked = true;
	}
	
	return checked ;
}
2

Each and every id must be unique; no two elements can share them. Otherwise, your page will not be valid. The checkboxes are not an array on the page; they only become an array when processed by a server script that recognizes the syntax of using to identify name/value pairs to be put in an array. They are passed to the server simply as a string of individual name/value pairs.

In the document, you can use document.getElementsByName(‘sel’) to create an array, store it in a variable, then use your loop to test for checked. Here’s a quick example that should illustrate the concept:


   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
   <html>
   <head>
   <title>Untitled</title>
   <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
   <style type="text/css">
   </style>
   <script type="text/javascript">
   window.onload=function(){
     ins=document.getElementsByName('in[]');
     alert(ins[1].value);
   }
   </script>
   </head>
   <body>
   <form action="">
   <p>
   <input type="checkbox" name="in[]" value="1" />
   <input type="checkbox" name="in[]" value="2" />
   <input type="checkbox" name="in[]" value="3" />
   </p>
   </form>
   </body>
   </html>
3

.
Yes, you are right…thanks for correcting me. :slight_smile:

Thanks, that is the answer I needed, I have used that function before, why couldn’t I remember it!!!..arrrrr.

It worked perfectly, here is the result:


function CheckForm(){
	var checked=false;
	var elements = document.getElementsByName("sel[]");
	for(var i=0; i < elements.length; i++){
		if(elements[i].checked) {
			checked = true;
		}
	}
	if (!checked) {
		alert('Yada yada yada, some error message');
	}
	return checked;
}
4

. . .why couldn’t I remember it?

I suspect that if anyone were to craft a well-designed study, they would discover that the ability to remember the commands and syntax of any one language is inversely proportional to the number of languages known and being used at any one time. We should all be remunerated handsomely to be specialists. My personal forte is the <noscript></noscript> tag set. I have a formidable command of that one.