Third level does not render correctly

[yahyaerturan]

Hi,

I am using this plugin with joy, thanks.

First to make a dropdown work, I had to add class simple to parent elements.

In the second level, when I hover Electronics render is broken because it tries to create a new dropdown with div while it need to create a dropdown with a tag.

Here is my code:

$menu->addChild('Products', array('route' => 'products', 'attributes'=> array('class' => 'simple')));
$menu['Products']->addChild('Electronic', array('route' => 'electronics', 'attributes'=> array('class' => 'simple')));
$menu['Products']['Electronic']->addChild('Mobile Phones', array('route' => 'mobile-phones'));

[codedmonkey]

The reason a dropdown menu doesn't work without the simple class is because by default you need to enable dropdowns manually with JavaScript: $('.ui.dropdown').dropdown();.

I expected the submenu thing to come up fairly soon. In Semantic UI, a submenu parent is not supposed to have its own URL (see Semantic-Org/Semantic-UI#453), even though this is possible with KnpMenu. For now I recommend changing your menu structure to something like the following, because this is unlikely to change in Semantic UI anytime soon.

$menu->addChild('Products', array('attributes'=> array('class' => 'simple')));
$menu['Products']->addChild('All products', array('route' => 'products'));
$menu['Products']->addChild('Electronic', array('attributes'=> array('class' => 'simple')));
$menu['Products']['Electronic']->addChild('All electronics', array('route' => 'products'));
$menu['Products']['Electronic']->addChild('Mobile Phones', array('route' => 'mobile-phones'));