Selecting multiple checkboxes with Javascript verification

Question

I'm writing a form whereby multiple checkboxes can be selected and saved into a MySQL database. However, I now want to limit the number of checkboxes a user can select using javascript, and have run into some trouble.

It seems for the import function to still work, each checkbox needs to have the same name as each other so they can be identified and imploded, however for the Javascript function to work each name needs to be different so that they can be differentiated.

Any suggestions would be gratefully received!

Here's the code that I've been playing around with.

Javascript function:

<?php $calc = mysql_query($query) or die(mysql_error()); ?>

<SCRIPT LANGUAGE="javascript">

function KeepCount() 
{
var NewCount = 0

<?php while($count_row = mysql_fetch_array($calc)){
echo "

if (document.import1.checkbox".$count_row['id'].".checked)
{NewCount = NewCount + 1}

";
} ?>

if (NewCount == 6)
{
alert('You can select up to 5 competitors. If you wish to import more you will need to add more judges.')
document.import1; return false;
}
} 
</SCRIPT>

Form:

<form action="import_process.php" method="post" name="import1" id="import1">
<input name="import" type="submit" id="import" value="Import">

<table>
<tr>
<td>&nbsp;</td>
<td>Name</td>
<td>Gender</td>
</tr>

<?php $counter = 1;
$result = mysql_query($query) or die(mysql_error());
while($row = mysql_fetch_array($result)){
echo "<tr bgcolor=white>";
echo "<td align=\"center\">
<input name=\"checkbox".$row['id']."\" type=\"checkbox\" id=\"checkbox[]\" value=\"".$row['id']."\" onClick=\"return KeepCount()\"></td>";
}
echo "<td>".$row['name']."</td>";
echo "<td>".$row['gender']."</td>";
echo "</tr>";
$counter++;
}
?>
</table>
</form>

import_process.php:

if(isset($_POST['checkbox'])){
$checkbox = $_POST['checkbox'];
$id = "('" . implode( "','", $checkbox ) . "');" ; 
$sql="
INSERT INTO..."

Answer 1

It's a little bit difficult to understand your code, but i think you get confused by the difference of name an id. Id must be different in every checkbox, name must be the same:

<input id=\"checkbox".$row['id']."\" type=\"checkbox\" name=\"checkbox[]\" value=\"".$row['id']."\" onClick=\"return KeepCount()\"></td>";

And the name-attribute is the one, wich needs the [], so you get the result in the array $_POST['checkbox'] .

The second is, that your function KeepCount seems to check always the same checkbox (or I really don't understand how it works) because whatever $count_row['id'] is, it's set once while the page is parsed so the javascript function cannot really count anything.

So change the checkbox-creation like this:

<input id=\"checkbox".$row['id']."\" type=\"checkbox\" name=\"checkbox[]\" value=\"".$row['id']."\" onClick=\"return KeepCount(this)\"></td>";

and the javascript like this

var count = 0;    

function KeepCount(it) {
 if (it.checked) {
  count = count + 1;
 } else {
  count = count - 1;
 }
 if (count == 6) {
  alert('You can 
  etc.

That should work.

By the way: value=row['id'] seems to be nonsense too.