[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 247
  • Last Modified:

Do Checkboxes Have a Limitation

I've got a form with many, many checkboxes MOST with the same name (zipselect). If too many (I have not determined what the failure number is) are selected, the form will not submit.

Question 1: Is there a limitation of the number of checkboxes allowed?

Question 2: How can I stop the submission and post an alert if say more that 100 zipselect check boxes are selected and NOT count my other set of checkboxes (propertytype) against the maximum allowed? Does the function have to be assigned to the button onclick or can it be assigned to the onsubmit?

0
webdork
Asked:
webdork
  • 4
1 Solution
 
tomvergoteCommented:
I am not aware of any checkbox limitations, but there are limits to the amount of data you can pass in a single request
Check here for a lot of info
http://www.faqts.com/knowledge_base/view.phtml/aid/638
0
 
tomvergoteCommented:
oh and regarding Q2, I would put it in the onsubmit to cover submission without clicking (enter for example)

code:

<html>
<head>
<!--
This file retrieved from the JS-Examples archives
http://www.js-x.com
1000s of free ready to use scripts, tutorials, forums.
Author: JS-Examples - http://www.js-examples.com/
-->


</head>
<body>

<script>
function cntprimary(cnt){
cnt=0;
   for(i=1; i<=8; i++){
   var enc=eval("document.nameofform.checkbox"+i+".checked");
     if(enc){
         cnt++;
     }
   }
   return cnt;
}
</script>
<form name=nameofform>
<input type="radio" name="checkbox1" value="check me">
<input type="radio" name="checkbox2" value="check me">
<input type="radio" name="checkbox3" value="check me">
<input type="radio" name="checkbox4" value="check me">
<input type="radio" name="checkbox5" value="check me">
<input type="radio" name="checkbox6" value="check me">
<input type="radio" name="checkbox7" value="check me">
<input type="radio" name="checkbox8" value="check me">
</form>
<BR><a href="javascript:alert(cntprimary())">how many?</a>

<BR><center><a href='http://www.js-x.com'>JS-X.com</a></center>
</body>
</html>
0
 
webdorkAuthor Commented:
Q1: Thanks, good info there.

Q2: Of course those are radio buttons not checkboxes. And I don't want to count I want to stop the submission and show an alert if the max is exceeded.
0
 
tomvergoteCommented:
you mean there are loads of radio button groups, or many radio buttons in a group?
the script i posted works for radio buttons too but it largely depends on a naming scheme.
You could go the naming scheme route (possibly defining them in an array) or loop through form elements. There are plenty of cut and paste scripts available if  you google, but you're best at finding your optimal script.
If you want to cancel form submission, make a function (myfunction) that returns true or false depending on the selection, then in the onsubmit of the form put return myfunction
function myfunction()
{
if (countboxes()>treshold)
     return false;


return true;
}

<form onsubmit="return myfunction()">
0
 
tomvergoteCommented:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<script language="Javascript">
function isValid(formRef){
//get number of form elements
var cnt_of_controls = formRef.elements.length;
//define counter
var cnt_of_selectedboxes=0;

//loop through form items
  for(i=0;i<cnt_of_controls;i++){
   //see if it's a checkbox
   if(formRef.elements[i].type == "checkbox"){
       // see if it's checked
      if(formRef.elements[i].checked == true){
          //count it
        cnt_of_selectedboxes ++;
      }
    }
  }

// if to many selections
if (cnt_of_selectedboxes>100)
{
  /cancel submit
 return false;
}
//submit
return true;
}


</script>
</HEAD>

<BODY>
<form name="someForm" action="" onSubmit="return isValid(this)">
<input type="checkbox" name="cb1">Check Box One<br>
<input type="checkbox" name="cb2">Check Box Two<br>
<input type="checkbox" name="cb3">Check Box Three<br>
<input type="checkbox" name="cb4">Check Box Four<br>
<input type="checkbox" name="cb5">Check Box Five<br>
<input type="Submit" value="Submit">
</form>
</BODY>
</HTML>
0

Featured Post

Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

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