Sending multiple checkbox options

Question

Hi, I'm creating a used cars website (written in PHP), and I'm stuck on sending advanced search options from form. I have more than 30 of them and I wonder if it's possible, and how, to send them in one variable (for example &options=1,2,3,5,6,10 or some other way..). Also I've heard that this is possible with "bitwise" but I don't have a clue how to do that. Or if someone have a better idea, please let me know.

Thanx

Answer 1

You can send them in an array.

<form method="post">
    <input type="checkbox" name="param[]" value="blue" />
    <input type="checkbox" name="param[]" value="red" />
    <input type="checkbox" name="param[]" value="orange" />
    <input type="checkbox" name="param[]" value="green" />
    <input type="checkbox" name="param[]" value="black" />
    <input type="submit" value="Submit" />
</form>

>> $_POST['param']
array('blue', 'orange')

You can even use multidimensional arrays:

<form method="post">
    <input type="checkbox" name="param[color][]" value="blue" />
    <input type="checkbox" name="param[color][]" value="red" />
    <input type="checkbox" name="param[color][]" value="orange" />
    <input type="checkbox" name="param[color][]" value="green" />
    <input type="checkbox" name="param[color][]" value="black" />
    <input type="checkbox" name="param[year][]" value="1999" />
    <input type="checkbox" name="param[year][]" value="2000" />
    <input type="checkbox" name="param[year][]" value="2001" />
    <input type="checkbox" name="param[year][]" value="2002" />
    <input type="checkbox" name="param[year][]" value="2003" />
    <input type="submit" value="Submit" />
</form>

>> $_POST['param']['color']
array('blue', 'green')

>> $_POST['param']['year']
array('2001', '2004')

Answer 2

Place them in an array and loop through them in the script that processes the form.

<form action="yourscript.php" method="POST">
     <label for="option1">Option 1</label>
     <input id="option1" type="checkbox" name="option[]" value="option1" />
     <label for="option2">Option 2</label>
     <input id="option2" type="checkbox" name="option[]" value="option2" />
     <label for="option3">Option 3</label>
     <input id="option3" type="checkbox" name="option[]" value="option3" />
     <input type="submit" name="submit" value=Submit />
</form>

The key is to place your checkbox values into in an array. option[]

Then in your script, you can access the array and loop through the submitted options.

if(!empty($_POST['submit']) //process the form

     if(!empty($_POST['option']) //check to see if any checkboxes were selected
     {
          $options = $_POST['option'];
          foreach($options as $option) //loop through the checkboxes
          {
               //do what you need to do with an option
          }
     }

}

Answer 3

You can write a script that iterates through all your fields (i.e. check boxes), collects the information into a hidden field, in the exact form you've presented (1,3,5 would mean 1 3 and 5 are checked, 2 and 4 are unchecked).

Turning it into a bit representation, would make it more complex to construct and de-construct. For example, in the former example, you can send the number 10101 == 17 to represent a location (i.e. locations 1 3 5 are "on", 2 and 4 are off). Again, not that easy, and not recommended. [You could also send a binary representation, in which case you'd send send 1000 == 8 == 1 + 3 + 5 ---- even more complex]

Answer 4

Ok guys thank you all for your answers. I've come up with a solution using jQuery. I've gathered all values from those checkboxes in array, and assign this array to one hidden field. All of these options are outside from form and they're not submited.

javascript:

$('.options').click(function() {
var selectedItems = new Array();
$("input:checkbox[name='opt[]']:checked").each(function() {selectedItems.push($(this).val());});
var data = selectedItems.join('|');
$("#opts").val(data);
});

and the form:

<form name="search" method="get" action="blabla.php">
.....
<input type="hidden" name="options" id="opts" value=""/>
....
</form>

and outside the form goes all options available

...
<input type="checkbox" name="opt[]" class="options" value="1"/>
<input type="checkbox" name="opt[]" class="options" value="2"/>
<input type="checkbox" name="opt[]" class="options" value="3"/>
...

Answer 5

GET requests will generate long, complicated URLs with that many options with the default behavior.

POST requests can leave you with short URLs, but can behave badly with the "back" button and aren't bookmark friendly.

To generate short URLs with a GET, you would either need an intermediary script that translated the selected options to something more compact, or you would need to observe the selected options using JavaScript and create the compact URL client-side.

Bitwise math would mean assigning each bit or group of bits in a single variable to a given option and predefined set of values. For example a 32 bit integer could represent 8 attributes of 4 bits each:

01010010010001001010101010101001

Or:

0101 0010 0100 0100 1010 1010 1010 1001
  #8   #7   #6   #5   #4   #3   #2   #1

So one integer could represent eight attributes, with 16 possible values per 4 bit group. Obviously that requires elaboration, but I'm sure someone on SO has already asked that question and I'm not up for typing any more right now. :)