«Return to Blog List Filter Custom Post Types with Dropdown Menu Using Custom Field Values

I was recently called on to allow user filtering of custom post results. WESST’s new website lists all trainings (custom post type) for all six regions, sorted by date of training. We needed to allow site visitors to show trainings for only the region they select from a dropdown menu.

NOTE: Looking for a way to filter custom post types with a custom taxonomy?

It should be noted that filtering in this example is done with custom fields, as opposed to custom taxonomies. In this case, there are a set number of regions, which won’t change, so there is no need to allow for easy creation of additional options. Using custom taxonomies is more complex because of (among other things) the need to dynamically create select options for filtering. Filtering with taxonomies also changes the queries, of course.

I’m not primarily a coder, so there may be a more concise way of doing this, but after lots of Googling, finding parts of the solution here and there, this works the way I want it to. See it in action on WESST’s website. In the meantime, if you’re a coder, feel free to contact me and show me a better way.

<form method="post" action=""> 
      <select name="trngregion" id="region" class="postform" onchange="submit();"> <!--establish 'sort value'-->
           <option <?php echo ($_POST['trngregion'] == '') ? ' selected="selected"' : ''; ?> value="">All Regions (default)</option> 
           <option <?php echo ($_POST['trngregion'] == 'Albuquerque') ? ' selected="selected"' : ''; ?> value="Albuquerque">Albuquerque</option> 
           <option <?php echo ($_POST['trngregion'] == 'Farmington') ? ' selected="selected"' : ''; ?> value="Farmington">Farmington</option> 
           <option <?php echo ($_POST['trngregion'] == 'Las Cruces') ? ' selected="selected"' : ''; ?> value="Las Cruces">Las Cruces</option> 
           <option <?php echo ($_POST['trngregion'] == 'Rio Rancho') ? ' selected="selected"' : ''; ?> value="Rio Rancho">Rio Rancho</option> 
           <option <?php echo ($_POST['trngregion'] == 'Roswell') ? ' selected="selected"' : ''; ?> value="Roswell">Roswell</option> 
           <option <?php echo ($_POST['trngregion'] == 'Santa Fe') ? ' selected="selected"' : ''; ?> value="Santa Fe">Santa Fe</option> 
      </select> 
</form>
<?php 
      $paged = ( get_query_var('paged') ) ? get_query_var('paged') : 1; 
      $today = date('Ymd', strtotime('-6 hours')); 
      if( !isset($_POST['trngregion']) || '' == $_POST['trngregion']) { //if 'sort value' not selected
           $traininglist= new WP_Query( array( //this is the basic query without region selected (the easy part)
                'post_type' => 'training', 
                'posts_per_page' => 6, 
                'paged' => $paged, 
                'meta_key' => 'trng_startdate', 
                'orderby' => 'meta_value', 
                'order' => 'ASC', 
                'meta_query' => array(
                     array( 
                     'key' => 'trng_endate', 
                     'meta-value' => $value, 
                     'value' => $today, 
                     'compare' => '>=', 
                     'type' => 'CHAR'
                      ) 
                 ) 
           ) ); 
      } else { <strong>//if sort value exists, the query that compares sort value and custom field value</strong>
      $trainingregion = $_POST['trngregion']; //get 'sort value'
      $traininglist= new WP_Query( array( 
           'post_type' => 'training', 
           'posts_per_page' => -1, //unlimited posts keeps paging from resetting sort
           'paged' => $paged, 
           'meta_key' => 'trng_startdate', 
           'orderby' => 'meta_value', 
           'order' => 'ASC', 
           'meta_query' => array( 
                'relation' => 'AND', //add query that compares 'sort value' with 'custom field value'
                     array( 
                     'key' => 'trng_endate', 
                     'meta-value' => $value, 
                     'value' => $today, 
                     'compare' => '>=', 
                     'type' => 'CHAR'
                     ),
                     array( //add query that compares 'sort value' with 'custom field value'
                     'key' => 'trng_region', //custom field 
                     'value' => $trainingregion, //sort value 
                     'type' => 'CHAR', 
                     'compare' => '=' 
                     ) 
                ) 
           ) ); 
      } 
 if ($traininglist->have_posts()) : 
      if ($trainingregion) { 
           echo '<div class="trngfilter"><h2>'.$trainingregion.' Training Events</h2></div>'; //heading for sorted results 
      } 
 while ( $traininglist->have_posts() ) : $traininglist->the_post(); 
 ?>

Display results here

<?php 
      endwhile; 
           else : 
           echo '<p>There are no upcoming '.$trainingregion.' trainings listed.</p>'; //message for no result
      endif; 
      if(function_exists('wp_pagenavi')) {
      wp_pagenavi(array('query' => $traininglist));
      } else {
      echo 'Please enable WP-PageNavi!';
      } 
 wp_reset_query(); 
 ?>

Tags: Code