This has been driving me mad for quite some time now, I’m using the example found in the WordPress codex for submitting wp_dropdown_categories using Javascript (

However, if I change ‘value_field’ to anything other than the ID it doesn’t fire when I change the select option, annoyingly it doesn’t throw any errors in the console either.

This is my code so far

<?php $args = array(
    'show_option_all'    => 'Filter by name',
    'value_field'        => 'slug',
    'id'                 => 'selectName',
    'taxonomy'           => 'name'

wp_dropdown_categories( $args ); ?>
<script type="text/javascript">
    var dropdown = document.getElementById("selectName");
    function onCatChange() {
        if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {
            location.href = "<?php echo esc_url( home_url( '/' ) ); ?>redirect/here/"+dropdown.options[dropdown.selectedIndex].value;
    dropdown.onchange = onCatChange;

Could anyone explain to me why it seems to break if you use anything other than the ID for value_field? If I remove the ‘value_field’ line or change it to ID it works perfectly but I really need it to show the slug!

Thanks in advance

Read more here: Using the taxonomy slug with WP Dropdown Categories and Javascript submit


If you know the solution of this issue, please leave us a reply in Comment section, to update the question.

Wordpress related questions and answers: