limit number of checkboxes allowed javascript

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

FarmFreshCode 225 posts 422 karma points

Jun 13, 2012 @ 17:32

Limit Number of Checkboxes Allowed - Javascript

Hey guys.. I have a general Javascript question that I have having trouble with.. I am using the following code below..

<script type="text/javascript">
function checkboxlimit(checkgroup, limit){
    var checkgroup=checkgroup
    var limit=limit
    for (var i=0; i<checkgroup.length; i++){
        checkgroup[i].onclick=function(){
        var checkedcount=0
        for (var i=0; i<checkgroup.length; i++)
            checkedcount+=(checkgroup[i].checked)? 1 : 0
        if (checkedcount>limit){
            alert("You can only select a maximum of "+limit+" checkboxes")
            this.checked=false
            }
        }
    }
}
</script>

<form method="post" id="thanks" name="thanks">

<!--If I change "tabChoices[]" to "tabChoices" (without the array) it works fine -->
<input type="checkbox" name="tabChoices[]" value="EXAMPLE 1" id="tabChoices_1"/>
<input type="checkbox" name="tabChoices[]" value="EXAMPLE 2" id="tabChoices_2"/>
<input type="checkbox" name="tabChoices[]" value="EXAMPLE 3" id="tabChoices_3"/>
</form>


<script type="text/javascript">checkboxlimit(document.forms.thanks.tabChoices, 2)</script>

However the use of the array seems to be causing me problems. I need to use: name="tabChoices[]" so that I can capture this information in an email form... BUT then the checkbox limit doesnt work. if I remove the "[]" then the checkbox limiter works.. but I dont get the results in my email...

Any Thoughts??

Copy Link

FarmFreshCode 225 posts 422 karma points

Jun 13, 2012 @ 17:49
0
SOLUTION FOUND:
```
<script type="text/javascript">checkboxlimit(document.forms.thanks["tabChoices[]"], 2)</script>
```
via @Kieranties

https://gist.github.com/2924879
http://Kieranties.com
Copy Link

JohnC 37 posts 61 karma points

Jun 13, 2012 @ 17:50

could you not wrap the checkboxes in a span with a id for the group then do something like

<script type="text/javascript">
function checkboxlimit(checkgroup, limit){
    var checkgroup=document.getElementById(checkgroupname).getElementsByTagName("input")
    var limit=limit
    for (var i=0; i<checkgroup.length; i++){
        checkgroup[i].onclick=function(){
        var checkedcount=0
        for (var i=0; i<checkgroup.length; i++)
            checkedcount+=(checkgroup[i].checked)? 1 : 0
        if (checkedcount>limit){
            alert("You can only select a maximum of "+limit+" checkboxes")
            this.checked=false
            }
        }
    }
}
</script>
<form method="post" id="thanks" name="thanks">

<!--If I change "tabChoices[]" to "tabChoices" (without the array) it works fine -->
<div id="groupName">
 <input type="checkbox" name="tabChoices[]" value="EXAMPLE 1" id="tabChoices_1"/>
    <input type="checkbox" name="tabChoices[]" value="EXAMPLE 2" id="tabChoices_2"/>
    <input type="checkbox" name="tabChoices[]" value="EXAMPLE 3" id="tabChoices_3"/>
</div>
</form>

Please note i haven't really modified the javascript much

Copy Link

is working on a reply...

This forum is in read-only mode while we transition to the new forum.

You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies