Submenu doesn't work about mdlwp

[braginteractive]

Material Design Lite doesn't have styling for submenus.

[Rambou]

Yes i know although one way to add submenu to this theme which is needed and there is an option on wordpress is like this.

<nav respond-plugin type="menu" menu="primary" class="mdl-navigation mdl-layout--large-screen-only">

                <li id="home" class="mdl-navigation__link" >Link 1</li>
                <a class="mdl-navigation__link" href="page/news.html">Link 2</a>
                <a class="mdl-navigation__link" href="#">Link 3</a>

                <!-- sub menu only visible when clicked on the link above -->
                <ul class="mdl-menu mdl-menu--bottom-left mdl-js-menu mdl-js-ripple-effect"
                    for="home">
                    <a class="mdl-menu__item" href="index.html">SubLink 1</a>
                    <a class="mdl-menu__item" href="index.html">SubLink 2</a>
                </ul>
........

The question is how to edit the Custom nav_walker to make support this?

[Rambou]

Anyway i did some changes in your nav_walker class and hope that now it should work like a charm. I will make a pull request soon.

	function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
		global $previous;

		$indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';

		$class_names = $value = '';

		$classes = empty( $item->classes ) ? array() : (array) $item->classes;
		$classes[] = 'menu-item-' . $item->ID;

		$class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) );

		if ( in_array( 'current-menu-item', $classes ) )
				$class_names .= ' is-active';

		$class_names = $class_names ? ' class="mdl-navigation__link ' . esc_attr( $class_names ) . '"' : '';

		$id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args );
		$id = $id ? ' id="' . esc_attr( $id ) . '"' : '';

		$output .= $indent . '';

		$attributes  = ! empty( $item->attr_title ) ? ' title="'  . esc_attr( $item->attr_title ) .'"' : '';
		$attributes .= ! empty( $item->target )     ? ' target="' . esc_attr( $item->target     ) .'"' : '';
		$attributes .= ! empty( $item->xfn )        ? ' rel="'    . esc_attr( $item->xfn        ) .'"' : '';
		$attributes .= ($item->menu_item_parent)? (! empty( $item->url )        ? ' href="'   . esc_attr( $item->url        ) .'"' : ''): '';
		$attributes .= ! empty( $item->ID )        ? ' id="'   . esc_attr( $item->ID        ) .'"' : '';
		if ($item->menu_item_parent){
			$attributes .= 'class="mdl-menu__item"';
	  }else{
			$attributes .= $class_names;
		}


		$item_output = $args->before;

		if (!$item->menu_item_parent && $previous->menu_item_parent){
			$item_output .= '</ul>';
		}

		if ($item->menu_item_parent && !$previous->menu_item_parent){
			$item_output .= '<ul class="mdl-menu mdl-menu--bottom-left mdl-js-menu mdl-js-ripple-effect" for="'. $item->menu_item_parent.'">';
		}
		$item_output .= '<a'. $attributes .'>';
		$item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
		$item_output .= '</a>';
		$item_output .= $args->after;


		$output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
		$previous = $item;
	}