How to pass multiple checkbox values to wordpress query?

Question

I am working on a website that has multiple check boxes and I want to show results based on what user has selected.

There are about 16 check boxes for music, 8 check boxes for venues and 6 radio buttons for area. The user can check a maximum of 3 check boxes from Music category, a maximum of 3 from Venues and 1 from Area. How do I accomplish this wordpress query that would show posts only from categories that are selected.

For example, If a user has selected House, Techno and Dubstep in Music, Miami as Area, and they want to search for events, music festivals, and live venues, How can I get that using wordpress query?

if(!empty($_POST)){
            global $names;
            $names  = $_POST['music'];
            $music = implode(",", $names);
            $echo $music;
  }

That will echo out all the selected checkboxes as house, dubstep, Miami, music festivals. Now I want to show posts that are in caegories of house, dubstep and are in music festivals category, and in miami area.

What I've used is

 $args = array (
      'category_name' => $music,
      'posts_per_page' => 12,
      'orderby' => 'title',
      'order' => 'ASC',
     );
$posts = query_posts($args);

But this will show all the posts from house, dubstep which is fine but it also shows all posts from music festivals that are not even in house and dubstep category.

Here is my HTML code for checkboxes

        <div class="customsearchul">
        <div id="searchArea">
        <ul>
        <li><h4>Area:</h4></li>
        <li>All of London<input type="radio" name="area" value="london" checked="london"/></li>
        <li>North<input type="radio" name="area" value="north" /></li>
        <li>East<input type="radio" name="area" value="east" /> </li>   
        <li>South<input type="radio" name="area" value="south" /></li>
        <li>West<input type="radio" name="area" value="west" /></li>
        <li>Central<input type="radio" name="area" value="central" /></li>
        </ul>  
        </div>
        </div>

        <div class="customsearchul">
        <div id="searchMusic">
        <ul>
        <li><h4>Music:</h4></li>
        <li>House<input type="checkbox" name="music[]" value="house" /></li>
        <li>Techno<input type="checkbox" name="music[]" value="techno" /></li>
        <li>Trance<input type="checkbox" name="music[]" value="trance" /></li>
        <li>Electronica<input type="checkbox" name="music[]" value="electronica" /></li>  
        <li>Drum and Bass<input type="checkbox" name="music[]" value="drum-and-bass" /></li>
        <li>Garage<input type="checkbox" name="music[]" value="garage" /></li>
        <li>Dubstep<input type="checkbox" name="music[]" value="dubstep" /></li>
        <li>Trap<input type="checkbox" name="music[]" value="trap" /></li>
        </ul> 
        </div> 
        </div>

        <div class="customsearchul" style="margin-top: 34px;">
        <div id="searchMusic">
        <ul>
        <li>Hip-Hop<input type="checkbox" id="music" name="music[]" value="hiphop" /></li>
        <li>R'n'B<input type="checkbox" name="music[]" value="rnb" /></li>
        <li>Rock<input type="checkbox" name="music[]" value="rock" /></li>
        <li>Indie<input type="checkbox" name="music[]" value="indie" /></li>
        <li>Reggae<input type="checkbox" name="music[]" value="reggae" /></li>
        <li>Retro 80's/90's<input type="checkbox" name="music[]" value="retro" /></li>
        <li>Party Bangers<input type="checkbox" name="music[]" value="party-bangers" /></li>
        <li>Chart Hits<input type="checkbox" name="music[]" value="chart-hits" /></li>
        </ul>  
        </div>
        </div>

        <div class="customsearchul">
        <div id="searchType">
        <ul>
        <li><h4>Search Type:</h4></li>
        <!--<li>Everything<input type="checkbox" name="occasion[]" value="debauchery" /></li> -->
        <li>Nightclubs<input type="checkbox" name="occasion[]" id="nightclub" value="nightclub" checked="checked" /></li>
        <li>Events & Tickets<input type="checkbox" name="occasion[]" value="club-guide" checked="checked" /> </li>   
        <li>Live Venues<input type="checkbox" name="occasion[]" value="festivals" checked="checked" /></li>
        <li>Artist Interviews<input type="checkbox" name="occasion[]" value="artist" checked="checked" /></li>
        </ul>
        </div>
        </div>
       <!-- <input class="searchbutton" type="submit" value="Search" id="performsearch"/> -->

        </form>

Thanks in advance for your help.

You would need to add conditional parameters to a WP_Query() (instead of query_posts) depending on the checkboxes. It's difficult to illustrate a working example without knowing your checkbox setup though — MBL, Mar 20 '14 at 12:18
You would probably need to take a look through the parameters in relation to your checkboxes, but I suspect you'll need the Taxonomy Parameters to conditionally show your specific category combinations — MBL, Mar 20 '14 at 12:32
That is kind of making sense. I need to check out about using tax query. Thanks for your help — user48752, Mar 20 '14 at 12:36
Actually if you're not using custom post types then the Category Parameters should be what you need — MBL, Mar 20 '14 at 12:38

MBL · Accepted Answer · 2014-03-20 19:01:08Z

OK here's an attempt, however I don't know the exact structure of your categories taxonomy so it may need some slight tweaking. I've updated the HTML of your form so it uses the values selected by the user, then there's a block of PHP code which runs a custom WP_Query to display the relevant posts (which you can edit to display how you like, currently it just returns an unordered list of posts)

HTML Form

<!-- THE HTML FOR THE FORM -->
<form action="" method="post">
    <div class="customsearchul">
    <div id="searchArea">
    <ul>
        <?php // Get the values from $_POST for area
            if($_POST['area']) { $a=$_POST['area'];} else { $a='';} ?>
        <li><h4>Area:</h4></li>
        <li>All of London<input type="radio" name="area" value="london" <?php if ($a == 'london' || ! isset($_POST['area']) ) { echo 'checked'; } ?> /></li>
        <li>North<input type="radio" name="area" value="north" <?php if ($a == 'north' ) { echo 'checked'; } ?> /> </li>
        <li>East<input type="radio" name="area" value="east" <?php if ($a == 'east') { echo 'checked'; } ?> /> </li>   
        <li>South<input type="radio" name="area" value="south" <?php if ($a == 'south') { echo 'checked'; } ?> /></li>
        <li>West<input type="radio" name="area" value="west" <?php if ($a == 'west') { echo 'checked'; } ?> /></li>
        <li>Central<input type="radio" name="area" value="central" <?php if ($a == 'central') { echo 'checked'; } ?> /></li>
    </ul>  
    </div>
</div>

<div class="customsearchul">
    <div id="searchMusic">
        <ul>
        <?php // Get the values from $_POST for music
            if($_POST['music']) { $m=$_POST['music'];} else { $m[]='';} ?>                      
            <li><h4>Music:</h4></li>
            <li>House<input type="checkbox" name="music[]" value="house" <?php if (in_array('house', $m)) { echo 'checked'; } ?> /></li>
            <li>Techno<input type="checkbox" name="music[]" value="techno" <?php if (in_array('techno', $m)) { echo 'checked'; } ?> /></li>
            <li>Trance<input type="checkbox" name="music[]" value="trance" <?php if (in_array('trance', $m)) { echo 'checked'; } ?> /></li>
            <li>Electronica<input type="checkbox" name="music[]" value="electronica" <?php if (in_array('electronica', $m)) { echo 'checked'; } ?> /></li>  
            <li>Drum and Bass<input type="checkbox" name="music[]" value="drum-and-bass" <?php if (in_array('drum-and-bass', $m)) { echo 'checked'; } ?> /></li>
            <li>Garage<input type="checkbox" name="music[]" value="garage" <?php if (in_array('garage', $m)) { echo 'checked'; } ?> /></li>
            <li>Dubstep<input type="checkbox" name="music[]" value="dubstep" <?php if (in_array('dubstep', $m)) { echo 'checked'; } ?> /></li>
            <li>Trap<input type="checkbox" name="music[]" value="trap" <?php if (in_array('trap', $m)) { echo 'checked'; } ?> /></li>
            <li>Hip-Hop<input type="checkbox" id="music" name="music[]" value="hiphop" <?php if (in_array('hiphop', $m)) { echo 'checked'; } ?> /></li>
            <li>R'n'B<input type="checkbox" name="music[]" value="rnb" <?php if (in_array('rnb', $m)) { echo 'checked'; } ?> /></li>
            <li>Rock<input type="checkbox" name="music[]" value="rock" <?php if (in_array('rock', $m)) { echo 'checked'; } ?> /></li>
            <li>Indie<input type="checkbox" name="music[]" value="indie" <?php if (in_array('indie', $m)) { echo 'checked'; } ?> /></li>
            <li>Reggae<input type="checkbox" name="music[]" value="reggae" <?php if (in_array('reggae', $m)) { echo 'checked'; } ?> /></li>
            <li>Retro 80's/90's<input type="checkbox" name="music[]" value="retro" <?php if (in_array('retro', $m)) { echo 'checked'; } ?> /></li>
            <li>Party Bangers<input type="checkbox" name="music[]" value="party-bangers" <?php if (in_array('party-bangers', $m)) { echo 'checked'; } ?> /></li>
            <li>Chart Hits<input type="checkbox" name="music[]" value="chart-hits" <?php if (in_array('chart-hits', $m)) { echo 'checked'; } ?> /></li>
        </ul>  
    </div>
</div>

<div class="customsearchul">
    <div id="searchType">
        <ul>
        <?php // Get the values from $_POST for music
            if($_POST['occasion']) { $o=$_POST['occasion'];} else { $o[]='';} ?>                                 
            <li><h4>Search Type:</h4></li>
            <!--<li>Everything<input type="checkbox" name="occasion[]" value="debauchery" /></li> -->
            <li>Nightclubs<input type="checkbox" name="occasion[]" id="nightclub" value="nightclub" <?php if (in_array('nightclub', $o)) { echo 'checked'; } ?> /></li>
            <li>Events &amp; Tickets<input type="checkbox" name="occasion[]" value="club-guide" <?php if (in_array('club-guide', $o)) { echo 'checked'; } ?> /> </li>   
            <li>Live Venues<input type="checkbox" name="occasion[]" value="festivals" <?php if (in_array('festivals', $o)) { echo 'checked'; } ?> /></li>
            <li>Artist Interviews<input type="checkbox" name="occasion[]" value="artist" <?php if (in_array('artist', $o)) { echo 'checked'; } ?> /></li>
        </ul>
    </div>
</div>
<input class="searchbutton" type="submit" value="Search" id="performsearch"/>
</form>

PHP Code (WP_Query)

<?php
    // Get the values from $_POST
    $a = ($_POST['area']);
    $m = ($_POST['music']);
    $o = ($_POST['occasion']);

    // Change the ID of the area category
    $a_tmp = get_category_by_slug( $a );
    $a_catID[] = $a_tmp->term_id;

    // Get the ID of each music category
    // Do some conditional checks to make sure
    // that we're correctly indexing an array
    // and that output is an array for the later
    // use with array_merge()
    if ( is_array($m) ) {
        // If we already have an array it means
        // multiple checkboxes have been selected
        foreach( $m as $m_cat ){
            $m_tmp = get_category_by_slug( $m_cat );
            $m_catIDs[] = $m_tmp->term_id;
        }
    } else {
        // If we don't have an array then
        // only one checkbox has been 
        // selected
        $m_tmp = get_category_by_slug( $m );
        $m_catIDs[] = $m_tmp->term_id;
    }

    // Get the ID of each occasion category
    // with the checking as described above
    if ( is_array($o) ) {
        foreach( $o as $o_cat ){
            $o_tmp = get_category_by_slug( $o_cat );
            $o_catIDs[] = $o_tmp->term_id;
        }
    } else {
        $o_tmp = get_category_by_slug( $o );
        $o_catIDs[] = $o_tmp->term_id;
    }

    // Concatenate the arrays
    $cat_IDs = array_merge($a_catID,$m_catIDs,$o_catIDs);

    // Build the WP_Query arguments
    $query_args =
        array (
            'post_type' => 'post',
            'post_status' => 'publish',
            //'category__and' => $cat_IDs
            'tax_query' => array(
                    array(
                        'taxonomy' => 'category',
                        'field' => 'term_id',
                        'operator' => 'AND',
                        'terms' => $cat_IDs
                    ),
                )

        );//end $query_args;

    $the_query = new WP_Query($query_args);

    // The Loop to echo posts
    if ( $the_query->have_posts() ) {
            // if we have posts, echo opening <ul>
            echo '<ul>';

        while ( $the_query->have_posts() ) {
            // while we have posts, echo the title in an <li>
            $the_query->the_post();
            echo '<li>' . get_the_title() . '</li>';
        }
            // echo the closing <ul>
            echo '</ul>';
    } else {
        // no posts found
        echo 'Nothing found.';
    } wp_reset_postdata();      /* Restore original Post Data */

?>

A few pointers:

You'll need to double check the taxonomy setup and ensure that the calls to get_category_by_slug is being passed the category's slug
Probably change the HTML outputted from the loop so it's more than a <ul>

First of all I would like to Thank you a ton for this. the get_category_by_slug is being passed correctly and it's giving me the correct catIDS, but the problem is it's is not showing any post. Secondly, the logic seems to be same as what I was doing before. For example, if I search for house and nightclub, The category__and would be 31, 10 which means that it will pull out all the posts under 31, 10 category which is not what I want. Instead I want it to show posts that are in nightclubs but in house only. — user48752, Mar 20 '14 at 15:51
Perhaps replacing category__and with category__in might do the trick? (If I understand the taxonomy setup correctly) — MBL, Mar 20 '14 at 16:02
I've updated the WP_Query() to use the tax_query params, could you give that a try? — MBL, Mar 20 '14 at 16:14
I turned on error reporting and tried your code it's giving me an error of Warning: Invalid argument supplied for foreach() and that's for this foreach loop foreach( $m as $m_cat ){ $m_tmp = get_category_by_slug( $m_cat ); $m_catIDs[] = $m_tmp->term_id; } — user48752, Mar 20 '14 at 16:26
also this error Warning: array_merge(): Argument #2 is not an array — user48752, Mar 20 '14 at 16:27

Stack Exchange Network

current community

your communities

more stack exchange communities

How to pass multiple checkbox values to wordpress query?

1 Answer 1

HTML Form

PHP Code (WP_Query)

Your Answer

Not the answer you're looking for? Browse other questions tagged posts categories query-posts or ask your own question.

Hot Network Questions

How to pass multiple checkbox values to wordpress query?

1 Answer 1

HTML Form

PHP Code (WP_Query)

Your Answer

Sign up or log in

Post as a guest

Not the answer you're looking for? Browse other questions tagged posts categories query-posts or ask your own question.

Related

Hot Network Questions