How to require a user to check 2 boxes and no more than 2 checkboxes with different n

[tadisaus2]

Hello,

I want to have a user to check at least 2 check boxes and NO more than 2 boxes. I have different checkbox names because I stored each nam on different field.
I tried this code but nothing happened.

Here is my code:
function clickCtr(chk){
var ctr = 0;
var frm = chk.form;
for (var i=1; i<=4; i++){
if (frm.elements["q1"+i].checked) ctr++;
}
if (ctr==2){
for (i=1; i<=4; i++){ //disable remaining unchecked checkboxes
if (!frm.elements["q1"+i].checked) frm.elements["q1"+i].disabled=true;
}
}
else{ //enable all
for (i=1; i<=4; i++){
frm.elements["q1"+i].disabled=false;
}
}
}

function chFrm() {
...
var ctr = 0;
var chks = document.frmName.elements["q1s"];
for (var i=1; i<=4; i++){
if (document.frmName.elements["q1"+i].checked) ctr++;
}
if (ctr<2){
msgbox = msgbox + "\n Please check 2 boxes.";
}
...
}

Here is my form:

<input type="checkbox" name="q11" id="q2" value="b" />b<BR />
<input type="checkbox" name="q12" id="q3" value="c" />c<BR />
<input type="checkbox" name="q13" id="q4" value="d" />d<BR />
<input type="checkbox" name="q111" id="q2" value="b" />b<BR />
<input type="checkbox" name="q112" id="q3" value="c" />c<BR />
<input type="checkbox" name="q113" id="q4" value="d" />d<BR />

Thanks for your help.

[epots9]

function chFrm() 
{
    var ctr = 0;
    var chks = document.frmName.q;
    var msgbox;
    for (var i=0; i<chks.length; i++)
    {
        if (chks[i].checked)
        {
            ctr++;
        }
    }
    if (ctr<2 || ctr>2)
    {
        msgbox = msgbox + "\n Please check 2 boxes.";
    }
    else if(ctr == 2)
    {
        for (var i=0; i<chks.length; i++)
        {
            chks[i].disabled = !chks[i].checked
        }
    }
}
 

[HTML]
<form name="frmName">
<input type="checkbox" name="q" id="q2" value="b" />b<BR />
<input type="checkbox" name="q" id="q3" value="c" />c<BR />
<input type="checkbox" name="q" id="q4" value="d" />d<BR />
<input type="checkbox" name="q" id="q2" value="b" />b<BR />
<input type="checkbox" name="q" id="q3" value="c" />c<BR />
<input type="checkbox" name="q" id="q4" value="d" />d<BR />
<input type="button" name="submit" value="submit" onclick="chFrm();" />
</form>
[/HTML]

what i posted above will will disable the checkboxs when only 2 are selected, when the button it clicked. if u dont' want the button use this:

        <script type="text/javascript">
function chFrm() 
{
    var ctr = 0;
    var chks = document.frmName.q;
    var msgbox;
    for (var i=0; i<chks.length; i++)
    {
        if (chks[i].checked)
        {
            ctr++;
        }
    }
    if (ctr<2 || ctr>2)
    {
        msgbox = msgbox + "\n Please check 2 boxes.";
        for (var i=0; i<chks.length; i++)
        {
            chks[i].disabled = false
        }
    }
    else if(ctr == 2)
    {
        for (var i=0; i<chks.length; i++)
        {
            chks[i].disabled = !chks[i].checked
        }
    }
}
 

[HTML]
<form name="frmName">
<input type="checkbox" name="q" id="q2" value="b" onclick="chFrm();" />b<BR />
<input type="checkbox" name="q" id="q3" value="c" onclick="chFrm();" />c<BR />
<input type="checkbox" name="q" id="q4" value="d" onclick="chFrm();" />d<BR />
<input type="checkbox" name="q" id="q2" value="b" onclick="chFrm();" />b<BR />
<input type="checkbox" name="q" id="q3" value="c" onclick="chFrm();" />c<BR />
<input type="checkbox" name="q" id="q4" value="d" onclick="chFrm();" />d<BR />
</form>
[/HTML]

u'll have to play with it to make it work with your code.

tell me how it goes, good luck.

[tadisaus2]

The reason I have different checkbox names is to store in different field of each name.
Here is my checkbox names:
<input type="checkbox" name="q11" id="q2" value="b" />b<BR />
<input type="checkbox" name="q12" id="q3" value="c" />c<BR />
<input type="checkbox" name="q13" id="q4" value="d" />d<BR />
<input type="checkbox" name="q111" id="q2" value="b" />b<BR />
<input type="checkbox" name="q112" id="q3" value="c" />c<BR />
<input type="checkbox" name="q113" id="q4" value="d" />d<BR />

I like to have a js validation to check for ... if user check ONLY one box, when submitting the form generate error. If a user check 2 boxes, the rest of the boxes become disabled.

Thanks.

[epots9]

then u have to do it manually, no forloop. u have to make a if statement for each checkbox

[tadisaus2]

Can I use this?
if (!frm.elements["q1"+i].checked) frm.elements["q1"+i].disabled=true;

So it adds 1 to all checkboxes names.

thanks.

[epots9]

Can I use this?
if (!frm.elements["q1"+i].checked) frm.elements["q1"+i].disabled=true;

So it adds 1 to all checkboxes names.

thanks.

nope, cuz your names go q11, q112, q12, etc.

and your for loop will go q10, q11, q12, q13, q14, q15

[acoder]

You could use the form.elements array and check the type if these are the only checkboxes in the form.

[tadisaus2]

This is a good idea.
How do I use form.elements?
thanks.

[acoder]

See this link

[tadisaus2]

Yes. I tried that but still does not work.
Here is the code:
function chFrm() {
...
var ctr = 0;
var el, i=1;
while (typeof (el=document.frmName.elements["color"+(i++)]) != 'undefined') {
if (el.checked) ctr++;
}
if (ctr<2){
msgbox = msgbox + "\n Please check 2 boxes.";
}
...
}

thanks.

[acoder]

If these are the only checkboxes, you could try:

for (i=0; i<frm.elements.length; i++) {
  if (frm.elements[i].type == "checkbox")
    if (frm.elements[i].checked) num++;
}