• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 215
  • Last Modified:

validate checkbox

Experts-

Can someone help me with ensuring that at least one check box is selected?

<td width="110"><input type="checkbox" class="checkbox" name="windows" value="Windows" /><label for="windows">Windows</label></td>
<td width="130"><input type="checkbox" class="checkbox" name="gutterhelmet" value="Gutter Helmet" /><label for="gutterhelmet">Gutter Helmet</label></td>
</tr>
<tr>
<td width="110"><input type="checkbox" class="checkbox" name="roofing" value="Roofing" /><label for="roofing">Roofing</label></td>
<td width="130"><input type="checkbox" class="checkbox" name="icedefense" value="Ice Defense" /><label for="icedefense">Ice Defense</label></td>
</tr>
<tr>
<td width="110"><input type="checkbox" class="checkbox" name="siding" value="Siding" /><label for="siding">Siding</label></td>
<td width="130"><input type="checkbox" class="checkbox" name="drenergy" value="Dr. Energy Saver" /><label for="drenergy">Dr. Energy Saver</label></td>

Any help would be appreaicted

Thanks
Nick
0
nmarano
Asked:
nmarano
  • 2
  • 2
1 Solution
 
Big MontySenior Web Developer / CEO of ExchangeTree.org Commented:
here's a good approach if you have the option to use jQuery and the validator plug-in:

http://stackoverflow.com/questions/11512448/validation-for-at-least-one-checkbox
0
 
chaitu chaituCommented:
<script>
var count=0;
function checkBoxValid()
{
		input= document.getElementsByTagName("input");

		for(i=0;i<input.length;i++)
		{
			if(input[i].type =='checkbox' && input[i].checked)
			{
			 count++;
			}

		}

		if(count == 0)
		{
		  alert("please select atleast once check box")
		  return false;
		}

}
</script>

<form id='frm' onsubmit=' return checkBoxValid()'>
<td width="110"><input type="checkbox" class="checkbox" name="windows" value="Windows" /><label for="windows">Windows</label></td>
<td width="130"><input type="checkbox" class="checkbox" name="gutterhelmet" value="Gutter Helmet" /><label for="gutterhelmet">Gutter Helmet</label></td>
</tr>
<tr>
<td width="110"><input type="checkbox" class="checkbox" name="roofing" value="Roofing" /><label for="roofing">Roofing</label></td>
<td width="130"><input type="checkbox" class="checkbox" name="icedefense" value="Ice Defense" /><label for="icedefense">Ice Defense</label></td>
</tr>
<tr>
<td width="110"><input type="checkbox" class="checkbox" name="siding" value="Siding" /><label for="siding">Siding</label></td>
<td width="130"><input type="checkbox" class="checkbox" name="drenergy" value="Dr. Energy Saver" /><label for="drenergy">Dr. Energy Saver</label></td>
<td width="130"><input type="submit" class="checkbox" name="submit" value="submit" /></td>
</form>

Open in new window

0
 
nmaranoAuthor Commented:
Big- Thanks, but I am unable to use jQuery.

chaituu-  Thank you!  The code works perfectly.  One last question, is there a way for me to remove where the pop up says, "The page at ....." and only have it say Please select at least one check box?

THanks
Nick
image002.png
0
 
chaitu chaituCommented:
actuallly am not getting that pop up ;may be you need to chnage some settings in the browser.i have tested in IE8 and not getting any popup message like that.
0
 
nmaranoAuthor Commented:
Thank you very much for your help!
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now