Multiple Select Drop Down Menu in PHP
As a continuation from my entry PHP State Drop Down Menu - Reusable Code! I'm now going to cover updating the showOptionsDrop() function we created, to allow for multiple 'active' or selected items for the case of a multi-select drop down menu like you see in the image to the right.
It's actually a very easy change. All we really need to do is pass an array as the active variable instead of a singular string value.
I'm going to use a new array of colors to demo this update since it's a smaller more manageable array. Of course you can use this with any of the state, month or day of the week arrays from the last article.
PHP
<?php
$colors = array('red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet', 'pink', 'black', 'white', 'silver', 'gold');
?>
Before we could have just one of those items be the selected item, now we'll choose an array of multiple values to have selected
PHP
<?php
$chosen = array(3, 6, 2, 7);
?>
Now we just need to help the function recognize not only a multiple value but also still accept the single value passed (for legacy purposes.)
Updating The showOptionsDrop() Function
We need to help the function first decide if the items that need to be selected are being past as a string or array. We'll use the PHP built in function is_array() for that. If it is an array, we'll see if that item is in the array, if it is not an array we will see if the item is equal to the string that was passed.
PHP
<?php
function showOptionsDrop($array, $active, $echo=true){
$string = '';
foreach($array as $k => $v){
if(is_array($active)) # if it's an array
$s = (in_array($k, $active))? ' selected="selected"' : ''; # treat it like an array
else # otherwise...
$s = ($active == $k)? ' selected="selected"' : ''; # stick with what we had before with the old function
$string .= '<option value="'.$k.'"'.$s.'>'.$v.'</option>'."\n";
}
if($echo) echo $string;
else return $string;
}
?>
Working with Multiple Select Fields
Now that we have our function we just need to create our field and pass our arrays:
PHP & HTML
The important thing with the form is to remember that in order to show multiple values you must set the size="" attribute in the <select> tag, and to allow multiple values to be selected you must add the multiple="multiple" attribute to the <select>.
Also, when you are passing multiple values through a form when you name your field you will need to append [] to the name of the field to ensure you can collect all of your data in the script that processes the form after it has been submitted. So my select field which I may have defined with name="colors" before now must be name="colors[]" so the processing script recognizes colors as an array of values not one value for colors overwriting another, overwriting another.
<form name="colorform" action="" method="post">
<select name="colors[]" multiple="multiple" size="15">
<?php echo showOptionsDrop($colors, $chosen, true); ?>
</select><br />
<input type="submit" name="submit" value="submit" />
</form>
Putting it all Together
So now we'll put it all together for ya, a quick snippet for receiving the form data, or using the predefined chosen colors and outputting the whole thing. A fully functional PHP script.
<?php
if(!isset($_POST['submit'])) # If this form has not been submitted
$chosen = array(3, 6, 2, 7); # Use the default
else # Otherwise
$chosen = $_POST['colors']; # Use what has been submitted
function showOptionsDrop($array, $active, $echo=true){
$string = '';
foreach($array as $k => $v){
if(is_array($active))
$s = (in_array($k, $active))? ' selected="selected"' : '';
else
$s = ($active == $k)? ' selected="selected"' : '';
$string .= '<option value="'.$k.'"'.$s.'>'.$v.'</option>'."\n";
}
if($echo) echo $string;
else return $string;
}
$colors = array('red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet', 'pink', 'black', 'white', 'silver', 'gold');
?>
<form name="colorform" action="" method="post">
<select name="colors[]" multiple="multiple" size="15">
<?php echo showOptionsDrop($colors, $chosen, true); ?>
</select><br />
<input type="submit" name="submit" value="submit" />
</form>
Fabulous isn't it!
Popularity: 90% [?]
the newest discoveries, stories and shared tips!Come on, all the cool kids are doing it ;)



Thx this is pretty useful stuff ;)