Question

I have a user form that has dropdown boxes which i have populated using wp_dropdown_categories

Code:

<p class="optional"><label for="job_term_area"><?php _e('Job Area', 'appthemes'); ?>
</label> <?php
            $sel = 0;
            if (isset($posted['job_term_area']) &&
 $posted['job_term_area']>0) $sel = $posted['job_term_area']; 
            $args = array(

                'orderby'            => 'name', 
                'order'              => 'ASC',
                'name'               => 'job_term_area',
                'hierarchical'       => 1, 
                'echo'               => 0,
                'class'              => 'job_area',
                'selected'           => $sel,
                'taxonomy'           => 'job_area',
                'hide_empty'         => false
            );
            $dropdown = wp_dropdown_categories( $args );

            $dropdown = str_replace('class=\'job_area\' 
   >','class=\'job_area\' ><option value="">'.__('Select an Area&hellip;', 
  'appthemes').'</option>', $dropdown);
            echo $dropdown; ?> </p>

As you can see i have setup a taxonomy called job area and have added areas by adding them as categories.

I would like to filter this list based on another dropdown list so you would have :

Select Country = England (parent)
-buckinghamshire(child)
-bedforshire(child)

And then all counties list is populated in dropdown.

I was thinking of using parent – child in the taxonomy.

The issue is how to get the second dropdown to update – I’m familiar with jquery but Im stuck on the best method to achieve this…?

Any guidance will be appreciated…

I hope this makes sense its been a long day…

Answer 1

There are numerous plugins with AJAX integration that simplify doing this from scratch. A web search for “jquery cascade select” has numerous results

Here are a few examples:

http://www.prodiven.com/jcombo/

http://code.google.com/p/jquery-cascade/

https://github.com/jadb/jquery-cascade