Menu

Example

Razor

<kendo-menu>
    <hierarchical-datasource></hierarchical-datasource>
    <items></items>
    <li></li>
    <open-on-click />
    <popup-animation></popup-animation>
    <scrollable />
</kendo-menu>

ChildTags

Tag Name	Details
hierarchical-datasource	HierarchicalDataSourceTagHelper
items	MenuItemsTagHelper
li
open-on-click	MenuOpenOnClickSettingsTagHelper
popup-animation	MenuAnimationSettingsTagHelper
scrollable	MenuScrollableSettingsTagHelper

Attributes

Attribute	Type	Description
name	String	Sets the name of the component.
as-module	Boolean	Specifies whether the initialization script of the component will be rendered as a JavaScript module.
data-icon-class-field	String	Sets the field of the data item that provides the icon class of the menu items.
is-in-client-template	Boolean	When placing a Tag Helper within a Kendo Template, set the type to text/html and add the is-in-client-template="true" attribute.
bind-to	IEnumerable<MenuItemBase>	Binds a list of items to the Menu.
close-on-click	Boolean	Specifies that sub menus should close after item selection (provided they won't navigate).
deferred	Boolean	Suppress initialization script rendering. Note that this options should be used in conjunction with DeferredScripts method.
data-content-field	String	Sets the field of the data item that provides the content of the menu items.
data-icon-field	String	Sets the field of the data item that provides the icon name of the menu items.
data-image-url-field	String	Sets the field of the data item that provides the image url of the menu items.
data-source-id	String	The Id of the data source.
data-sprite-css-class-field	String	Sets the field of the data item that provides the sprite css class of the menu items.
data-text-field	String	Sets the field of the data item that provides the text of the menu items.
data-url-field	String	Sets the field of the data item that provides the url of the menu items.
direction	MenuDirection	Represents the menu item opening direction.
hover-delay	Double	Specifies the delay in ms before the menu is opened/closed - used to avoid accidental closure on leaving.
icon-position	IconPosition	Specifies the position of the icon in the Menu items using the text content as a reference.
on-activate	String	The name of the JavaScript function that will handle the activate event. Fires when a sub menu gets opened and its animation finished.
on-close	String	The name of the JavaScript function that will handle the close event. Fires before a sub menu gets closed. You can cancel this event to prevent closure.
on-data-bound	String	The name of the JavaScript function that will handle the dataBound event. Fires when the Menu is bound to the set DataSource.
on-deactivate	String	The name of the JavaScript function that will handle the deactivate event. Fires when a sub menu gets closed and its animation finished.
on-open	String	The name of the JavaScript function that will handle the open event. Fires before a sub menu gets opened. You can cancel this event to prevent opening the sub menu.
on-select	String	The name of the JavaScript function that will handle the select event. Fires when a menu item gets selected.
orientation	MenuOrientation	Specifies the orientation in which the menu items will be ordered.
popup-collision	String	Specifies how Menu should adjust to screen boundaries. By default the strategy is "fit" for a sub menu with a horizontal parent, meaning it will move to fit in screen boundaries in all directions, and "fit flip" for a sub menu with vertical parent, meaning it will fit vertically and flip over its parent horizontally. You can also switch off the screen boundary detection completely if you set the popupCollision to false.
script-attributes	IDictionary<String,Object>	Sets the attributes that will be added to the script tag of the component's initialization script.
security-trimming	Boolean