Use Combo Box in Kendo Menu

2 posts, 0 answers
  1. Chad
    Chad avatar
    1 posts
    Member since:
    Oct 2013

    Posted 14 Aug 2014 Link to this post

    I have a menu question:

    (1) Can the kendo-menu support the use of a combobox for a menu item? 
    (2) If the answer is yes to (1), then I have a question as to how to do it.

    I've created a jsfiddle here:

    If I define my kendo menu as follows:


    <ul id="menu"></ul>


    $(document).ready(function() {
        var menuItems = [{text: "Apple", url: ""},
                         {text: "Banana", url: "http:\/"},
                         {text: "Orange", url: ""}];
        var menuData = [{text: "Fruits", items: menuItems},
                        {text: "Site", url: ""},
                        {text: "Location", url: ""}];
        var menu = $("#menu").kendoMenu({ dataSource: menuData });

    This would display a menu such as:

    Fruits v | Site | Location

    Users would expand the 'Fruits' menu to see a list of sub-menu items (e.g. Apple, Banana, and Orange).

    Our requirements are to have the first item, 'Fruits', which will be rendered as a standard menu item drop down in the above code, to be rendered as a combobox (restricted to its list of data items) and to display the text from whatever list item is selected by the user. So, there would be no 'Fruits' text displayed, the menu item would display whatever item's text was selected from the combobox. 

    The menu datasource is dynamic so I don't think I can specify this in the html. But I have searched the kendo forums and demos and stackoverflow and can't find any relevant examples. The requirement is for the menu to function as follows. If 'Apple' is selected, the menu would appear as:

    Apple v | Site | Location

    If the user clicks the dropdown icon and selects 'Banana', the menu would appear as:

    Banana v | Items | Inventory  


  2. Alexander Valchev
    Alexander Valchev avatar
    2895 posts

    Posted 18 Aug 2014 Link to this post

    Hello Chad,

    I am afraid that the scenario you described is not supported out of the box.
    The menu events and popup components will interfere with the ComboBox' open/close event handlers. Please do not include a ComboBox widget as a menu item.

    Alexander Valchev
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top