how to make a user to check 2 checkboxes from different checkbox names

Hello,

I posted a similar message about 2 weeks ago. This message is a little different than the old message.
I have a form to have checkboxes with different checkbox names because I want to store each box in different field. Some one on this forum showed me already but it worked ONLY for the same checkbox name. This time, I have different names.

I want to have a user to check at least 2 boxes and NO more than 2 boxes.

Is there any way to do that?

Thanks.

Here is my code:

function clickCtr(chk){
var ctr = 0;
var chks = chk.form.elements[chk.name];
for (var i=0; i<chks.length; i++){
if (chks[i].checked) ctr++;
}
if (ctr==2){
for (i=0; i<chks.length; i++){ //disable remaining unchecked checkboxes
if (!chks[i].checked) chks[i].disabled=true;
}
}
else{ //enable all
for (i=0; i<chks.length; i++){
chks[i].disabled=false;
}
}
}

function chFrm() {
var msgbox = "You forgot the following question (s).";
var goon = msgbox

if (document.frmName.Rank.selectedIndex==0) {
msgbox = msgbox + "\n Please select one rank";
}

var CkRadioButton = false;
for (i = 0; i < document.frmName.Gender.length; i++) {
if (document.frmName.Gender[i].checked)
CkRadioButton = true;
}
if (!CkRadioButton) {
msgbox = msgbox + "\n Please check your gender";
}

var checkboxCk = false;
for (i = 0; i < document.frmName.country.length; i++) {
if (document.frmName.country[i].checked)
checkboxCk = true;
}
if (!checkboxCk) {
msgbox = msgbox + "\n Please check your country";
}

var checkboxCk = false;
for (i = 0; i < document.frmName.Race.length; i++) {
if (document.frmName.Race[i].checked)
checkboxCk = true;
}
if (!checkboxCk) {
msgbox = msgbox + "\n Please check your race";
}

var chks = document.frmName.elements["colors"];
for (var i=0; i<chks.length; i++){
if (chks[i].checked) ctr++;
}
if (ctr<2){
msgbox = msgbox + "\n Please check 2 boxes.";
}

// If no errors found, then go ahead to submit the form
if (msgbox == goon) {
return true;
} else {
alert(msgbox);
return false;
}
}

Here is my form:
<input type="checkbox" name="color1" id="q" value="a" />A<BR />
<input type="checkbox" name="color2" id="q2" value="b" />b<BR />
<input type="checkbox" name="color3" id="q3" value="c" />c<BR />
<input type="checkbox" name="color4" id="q4" value="d" />d<BR />

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

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

Hello,
I don't have "colors" checkbox name so it does not work.
var chks = document.frmName.elements["colors"];

I have color1, color2, ....

Thanks.

Can you help please?
Thanks.

Remove that line. I forgot to remove it. It's not needed, as you can see I didn't user that variable chks anywhere.
function chFrm() {
...
var ctr = 0;
var chks = document.frmName.elements["colors"];
for (var i=1; i<=4; i++){
if (document.frmName.elements["color"+i].checked) ctr++;
}
if (ctr<2){
msgbox = msgbox + "\n Please check 2 boxes.";
}
...
}

Hello,
I removed that line and tested it but nothing happened.
I saw this, var ctr = 0; in both places.

When I check the checkboxes and it let me to check all boxes.

Please help.
thanks.

Hi,
I like to add that "color1, color2, color3, color4" are not my real names. They are q1, q12, q13, .....,q11, q12..

Please help.
Thanks.

Can anyone help please?
I have more than 10 boxes so color"+i does not cover all.
If I have color11, color12, it does not work.
Big thanks.

What is really the names of the checkboxes, colorn or qn? This code will work for any number of checkboxes numbered sequentially from 1.
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.";
}
...
}Change the checkbox name "color" if needed.

Hello Glenn,
It shows errors right at this line: function clickCtr(chk){

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

Thanks.
Jenny.

function clickCtr(chk){
var ctr = 0;
var frm = chk.form;
var el, i=1;
while (typeof (el=frm.elements["color"+(i++)]) != 'undefined') {
if (el.checked) ctr++;
}
i=1;
if (ctr==2){ //disable remaining unchecked checkboxes
while (typeof (el=frm.elements["color"+(i++)]) != 'undefined') {
if (!el.checked) el.disabled=true;
}
}
else{ //enable all
while (typeof (el=frm.elements["color"+(i++)]) != 'undefined') {
el.disabled=false;
}
}

}
Same thing as earlier, change the checkbox name "color" if needed.

PERFECT!!!
It worked.
Big thanks!!!
Jenny.

Hello,

I posted this message a few months ago to require a user to check on 2 boxes but no more than 2 boxes and it worked perfectly.

I like to add a new question for the same syntax by using the same JS code and only modify the number, but nothing happen.

Is this code above only applied to ONE time?

If I want to add a new question that requires user to select 2 boxes but no more than 2 boxes, what should I do? how do I modify it?

Thanks,
Jenny.