How do I get the category slug from wp_dropdown_categories

Question

I am customizing a plugin. I needed it to show a list of the categories in hierarchy, which I got working with all of the functions of the plugin. I'm using wp_dropdown_categories, but I'd like to display the list of categories as their slugs, and not as their category names. Any suggestions?

Here's what I have so far:

function replace_id_for_slug( $option ) {
    $categories = get_categories( "hide_empty=0" );
    preg_match( '/value="(\d*)"/', $option[0], $matches );

    $id = $matches[1];
    $selectID = $nextItem;
    $slug = get_cat_slug( $id );

    foreach ( $categories as $category ) {
        if ( $category->cat_ID == $id ) {

        }
    }
    return preg_replace( "/value=\"(\d*)\"/", "value=\"$slug\"", $option[0] );
}

$select = wp_dropdown_categories(
    "hierarchical=1&hide_empty=0&echo=0&name=field_$nextItem&id=$selectID&class=categoriesBox"
);

echo $select;

---

I forgot to mention that this is for the admin backend. I've tried playing around with the walker class, but I am at a loss. Do you know of any other way this could be accomplished?

Answer 1

There is an argument walker for wp_dropdown_categories(). It accepts an instance of a custom walker, a class extending Walker_CategoryDropdown or the generic Walker.

Let’s create such a class. We have to change just one method.

class WPSE_Cat_Slug_Walker extends Walker_Category
{   function start_el( &$output, $category, $depth, $args, $id = 0 ) {
        $pad = str_repeat(' ', $depth * 3);

        $output .= "\t<option class=\"level-$depth\" value=\"".$category->term_id."\"";
        if ( $category->term_id == $args['selected'] )
            $output .= ' selected="selected"';
        $output .= '>';
        $output .= $pad.$category->slug; // The Slug!
        if ( $args['show_count'] )
            $output .= '&nbsp;&nbsp;('. $category->count .')';
        $output .= "</option>\n";
    }
}

Now we create an instance of our class …

$wpse_cat_slug_walker = new WPSE_Cat_Slug_Walker;

… and pass it to the dropdown:

$select = wp_dropdown_categories(
    array (
        'hierarchical' => 1,
        'hide_empty'   => 0,
        'echo'         => 0,
        'name'         => "field_$nextItem",
        'id'           => $selectID,
        'class'        => 'categoriesBox',
        'walker'       => $wpse_cat_slug_walker // the walker
    )
);

Note, this is completely untested, just an idea to show you the direction. :)

Answer 2

I did by a different way and works fine. Hope it can help too:

<?php wp_dropdown_categories( 'taxonomy=my_taxonomy&value_field=slug' ); ?>

    <script type="text/javascript">
        <!--
        var dropdown = document.getElementById("cat");
        function onCatChange() {
            if ( dropdown.options[dropdown.selectedIndex].value != -1 ) {
                location.href = "<?php echo esc_url( home_url( '/' ) ); ?>category/"+dropdown.options[dropdown.selectedIndex].value;
            }
        }
        dropdown.onchange = onCatChange;
        -->
    </script>

Answer 3

Here is an updated version of answer provided by @toscho, tested and working with WP 4.1.1.

class FGW_Cat_Slug_Walker extends Walker_CategoryDropdown{

    public function start_el(&$output, $category, $depth = 0, $args = array(), $id = 0){

        $pad = str_repeat(' ', $depth * 3);    // Create the padding (before nested terms)

        /** Generate the HTML for this option */
        $output.= sprintf("\t".
            '<option class="%1$s" value="%2$s" %3$s>%4$s%5$s</option>',
            /** %1$s - 'class' attribute */     'level-' . $depth,
            /** %2$s - 'value' attribute */     $category->slug,
            /** %3$s - 'selected' attribute */  ($category->slug == $args['selected']) ? ' selected="selected"' : '',
            /** %4$s - option text */           $category->name,
            /** %5$s - The term count */        ($args['show_count']) ? '&nbsp;&nbsp;(' . $category->count . ')' : ''
        );

    }
}