Multiple Select Drop Down Menu in PHP

Multi Drop Down Menu with Items SelectedAs 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:

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>.

{googlead}

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 & HTML

<?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!

This site runs on the Thesis WordPress Theme

Thesis Theme thumbnail

If you're someone who doesn't understand a lot of PHP, HTML, or CSS, Thesis will give you a ton of functionality without having to alter any code. For the advanced, Thesis has incredible customization possibilities via extensive hooks and filters. And with so many design options, you can use the template over and over and never have it look like the same site.

If you're more familiar with how websites work, you can use the fantastic Thesis User's Guide and world-class support forums to make more professional customizations than you ever thought possible. The theme is not only highly customizable, but it allows me to build sites with a much more targeted focus on monetization than ever before. You can find out more about Thesis below:

{ 19 comments }

Comments on this entry are closed.

Previous post:

Next post: