Compare the renderings of the two ContextMenus below:
<div id="example1">Right click (Kendo UI ContextMenu)</div>
<br />
<br />
<div id="example2">Right click (MVC ContextMenu)</div>
<ul id="contextmenu1">
</ul>
<script>
$("#contextmenu1").kendoContextMenu({
target: "#example1",
dataSource:
[{
text: "Item1",
},
{
text: "Item2",
}
]
});
</script>
@(Html.Kendo().ContextMenu()
.Name("contextmenu2")
.Target("#example2")
.Items(items =>
{
items.Add().Text("Item1");
items.Add().Text("Item2");
})
)
The item of the Kendo UI ContextMenu is rendered:
<li class="k-item k-menu-item k-first" role="menuitem" data-uid="d578b533-6933-416f-9624-96819ee95c45" aria-expanded="false">
<span class="k-link k-menu-link">
<span class="k-menu-link-text">Item1</span>
</span>
</li>
The item of the MVC ContextMenu is rendered:
<li class="k-item k-state-default k-menu-item k-first" role="menuitem" aria-expanded="false" id="contextmenu2_mn_active">
<span class="k-link k-menu-link">Item1</span>
</li>
The additional span with class k-menu-link-text is missing in the MVC component.
Identical rendering
Hello,
I have problem with menu control. Sometimes its items are duplicated. To reproduce it do the following:
- create a menu control;
- bind it to remote data source (to reproduce issue easier set some delay for server side method);
- hover on menu item (datasource request will start), fast leave menu item (don't wait until it open) and hover again (one more datasource request will start), leave it again (optional);
- wait some time until second request completed;
- open menu item.
As a result you will see duplicated menu items. This issue can be reproduced on your demo page https://demos.telerik.com/kendo-ui/menu/remote-data-binding.
Could you please suggest me some workaround for this?
BR,
Artsem