validating that at least two checkboxes ticked.

[oxidetones]

hey folks!

I have a form with multiple checkboxes (name="ID[]"). I need to validate that form, two checkoboxes at least need to be ticked. If one or none are ticked, there should be a pop up (or ajax overlay) telling the user to select at least two. The form shouldnt submit unless that happens.

Ive found a few scripts that Ive tried to edit, but Im not getting it to work... as an example:

<script type="text/javascript" language="JavaScript">
function checkscript() {
var boxesTicked = ""
for (i = document.getElementsByName('chkboxes').length - 1; i >= 0; i--) {
if (document.getElementsByName('chkboxes')[i].checked) {
boxesTicked = boxesTicked + document.getElementsByName('chkboxes')[i].value + "\n"
}
}
if (boxesTicked == "") {
alert ("You must select a box to continue.")
return false
}
else {
alert (boxesTicked)
return true;
}
}
</script>

This script still submits the form even though the pop up warns. Also, the pop up wont show the error message, it shows the form parameters.

Can anyone point me int he right direction?

Thanks, Adam

[Mohamed]

there is nothing wrong with the script as far as I can see. so may be you have html error. e.g you used onSubmit="function_name()" instead of onSubmit = "return function_name()".

Mohamed

[oxidetones]

thanks, i didnt notice that.

I did notice though that the script I posted was the original, heres the edited version (for <2 checkboxes):

<script type="text/javascript" language="JavaScript">
function checkscript() {
var boxesTicked = ""
for (i = document.getElementsByName('chkboxes').length - 1; i >= 0; i--) {
if (document.getElementsByName('chkboxes')[i].checked) {
boxesTicked = boxesTicked + document.getElementsByName('chkboxes')[i].value + "\n"
}
}
if (boxesTicked <2 ) {
alert ("Please choose at least two models to compare.")
return false
}
else {
alert (boxesTicked)
return true;
}
}
</script>

So the box shows the correct message now, but still continues to the following page... and the box is shown when 2 or more boxes are ticked

thanks again, adam

[Fotiman]

How are you calling checkscript?

As was already stated, your HTML should look something like this:

<form onsubmit="return checkscript();">

If you are missing that return, then your form will still submit.

(Note, this assumes you are using an inline onsubmit attribute of form)