Question

I have a question regarding checkboxes.

<form method="post">
I speak the following languages:
<input type="checkbox" name="lang[]" value="en">English<br />
<input type="checkbox" name="lang[]" value="fr">Français<br />
<input type="checkbox" name="lang[]" value="es">Español<br />
</form>

Is it necessary to name the checkboxes lang[] (using an array) or can I give each checkbox a seperate name, like:

<form method="post">
I speak the following languages:
<input type="checkbox" name="lang_en" value="en">English<br />
<input type="checkbox" name="lang_fr" value="fr">Français<br />
<input type="checkbox" name="lang_es" value="es">Español<br />
</form>

Question 1 I believe both works, if so when do you decide which to use?

Question 2 I am using the second method listed above so I can use PHP to detect which of the checkbox is selection by using a code similar to if(isset($_POST['lang_en'])). If I were to use the first method, is there a quick way to check if a particular checkbox is selected? At the moment the untested solution I can think of involves doing a if(in_array('lang_en', $_POST['lang'])) to check if it exist in $_POST.

Question 3 The main question is this: I am using the second method so I can easily check if a checkbox is selected in PHP. Now I want to add a text link which when clicked will select all the checkboxes. My Javascript is not too good, so I am using a script from http://www.shiningstar.net/articles/articles/javascript/checkboxes.asp but the example script uses an array for the checkbox’s names while my PHP code cannot check if the checkboxes are selected with arrays are used for the checkbox’s names. How can the javascript code be modified to work without arrays?

Hope I can get this annoying question figured out! Thanks!

EDIT

Javascript:

<!-- Begin
function checkAll(field)
{
for (i = 0; i < field.length; i++)
    field[i].checked = true ;
}

function uncheckAll(field)
{
for (i = 0; i < field.length; i++)
field[i].checked = false ;
}
//  End -->
</script>

HTML:

<form action="http://localhost/website/places/search" method="post" accept-charset="utf-8" name="subcategory">

<ul>
  <li><input type="checkbox" name="cuisine_American" value="American" /> American</li>
  <li><input type="checkbox" name="cuisine_Chinese" value="Chinese" onClick="checkAll(document.subcategory.cuisine)" /> Chinese</li>
  <li><input type="checkbox" name="cuisine_Indian" value="Indian" onClick="checkAll(document.subcategory.cuisine)" /> Indian</li>
  <li><input type="checkbox" name="cuisine_Japanese" value="Japanese" onClick="checkAll(document.subcategory.cuisine)" /> Japanese</li>
  <li><input type="checkbox" name="cuisine_Korean" value="Korean" onClick="checkAll(document.subcategory.cuisine)" /> Korean</li>
  <li><input type="checkbox" name="cuisine_Mexican" value="Mexican" onClick="checkAll(document.subcategory.cuisine)" /> Mexican</li>
  <li><input type="checkbox" name="cuisine_Middle Eastern" value="Middle Eastern" onClick="checkAll(document.subcategory.cuisine)" /> Middle Eastern</li>
  <li><input type="checkbox" name="cuisine_Pakistani" value="Pakistani" onClick="checkAll(document.subcategory.cuisine)" /> Pakistani</li>
  <li><input type="checkbox" name="cuisine_Italian" value="Italian" onClick="checkAll(document.subcategory.cuisine)" /> Italian</li>
</ul>

</form>

Answer 1

Answers:

1. Either works…depends on whether you want explicit names or an array
2. You can also use array_key_exists()
3. Can you post the javascript code you are using into your question? I’ll take a further look…

---

UPDATE:

Here is a jQuery solution for implementing your onclick handlers:

function checkAll(field){
    $(':checkbox[name^="cuisine_"]').each(function(index){
        this.checked=true;
    });
}

function uncheckAll(field){
    $(':checkbox[name^="cuisine_"]').each(function(index){
        this.checked=false;
    });
}

Note that you really don’t need to pass in field, unless you want to generalize this and pass in the string for the startswith pattern (e.g. cuisine_).