Help with must select at least one checkbox javascript function.

[anilreddy76]

Hi,

I have a dynamic form with multiple checkboxes. I need to make sure that at least one checkbox is checked but only when the checkbox is actually unchecked. For example, the user unchecks 4 out of 5 boxes but when he unchecks box 5 an alert appears that one box must be checked and box 5 is left checked until he checks another and then unchecks box 5.

I've written the following javascript function,but it is unchecking the check box after throwing the alert.I need to check the check box after throwing the alert.

HTML: Select all

function showElement(ID) {
var checkSelected = false;
for (i = 0; i < planForm.locationOptions.length; i++) {
if (planForm.locationOptions[i].checked) {
    checkSelected = true
    document.getElementById("refreshing").style.display="block";
}
}
if (!checkSelected) {
alert("At least ONE Location must be selected!");
checkSelected = true;
return false;
}
return true;
}

and calling this function under <html:multibox> onclick.

HTML: Select all

<html:multibox property="locationOptions" onclick="if(showElement('refreshing')){document.planForm.action='refreshPlanView.do';
                                                document.planForm.submit();}">

Please advise.

Thanks for the help.

[c010depunkk]

Your code would only work if all the boxes are unchecked or if the last box is unchecked. Try this:

HTML: Select all

function showElement(ID) {
var num_checked=0;
for (i = 0; i < planForm.locationOptions.length; i++) {
  if (planForm.locationOptions[i].checked) {
    num_checked++;
  }
}
if(num_checked==0) {
   alert("At least ONE Location must be selected!");
   return false;
}
return true;
}

[anilreddy76]

Hi,

Thanks for the code,but it is also doing the same thing.

I.e once the last check box is unchecked,it is throwing alert,but the checkbox is getting unselected.I need to keep the check box as selected after throwing alert and user clicking "Ok" on the alert.

Thanks

[c010depunkk]

Not sure if this will work, but try this:

HTML: Select all

function showElement(ID) {
var num_checked=0;
var last_checked=0;
for (i = 0; i < planForm.locationOptions.length; i++) {
  if (planForm.locationOptions[i].checked) {
    num_checked++;
    last_checked=i;
  }
}
if(num_checked==0) {
   alert("At least ONE Location must be selected!");
   planForm.locationOptions[last_checked].checked=true;
   return false;
}
return true;
}

[anilreddy76]

Hi,

Thanks for the input,but once the Alert is thrown it is checking the check box with value=0 as last_checked=0 has been declared,it is not checking the last unchecked check box.

Please advise..

Thanks

[c010depunkk]

That's true, that was a logic error on my part....

I think a feasible solution would be to declare a global variable 'last_checked' and every time a check box is checked (in the onclick eventf), set this global variable to the value of that box. Then when the last one is unchecked, you could re-check the box who's value is stored in the global variable....