dataBound

Fires when the Menu is bound to the set DataSource.

Event Data

e.item HTMLElement

The loaded item (at initial bound this will be the Menu root element).

e.dataItem Object

The dataItem that is being loaded or bound (at initial bound this should be undefined).

Example

<ul id="menu"></ul>
<script>
    var dataSource = new kendo.data.HierarchicalDataSource({
        transport: {
            read: {
                url: "https://demos.telerik.com/kendo-ui/service/Employees",
                dataType: "jsonp"
            }
        },
        schema: {
            model: {
                id: "EmployeeId",
                hasChildren: "HasEmployees"
            }
        }
    });

    var menu =  $("#menu").kendoMenu({
        dataTextField: "FullName",
        dataSource: dataSource,
        dataBound: function(){
/* The result can be observed in the DevTools(F12) console of the browser. */
            console.log("dataBound");
        }
    })
</script>

To set after initialization

<ul id="menu"></ul>
<script>
    var dataSource = new kendo.data.HierarchicalDataSource({
        transport: {
            read: {
                url: "https://demos.telerik.com/kendo-ui/service/Employees",
                dataType: "jsonp"
            }
        },
        schema: {
            model: {
                id: "EmployeeId",
                hasChildren: "HasEmployees"
            }
        }
    });

    var menu =  $("#menu").kendoMenu({
        dataTextField: "FullName",
        dataSource: dataSource
    }).data("kendoMenu");

    menu.bind("dataBound", function() {
/* The result can be observed in the DevTools(F12) console of the browser. */
        console.log("dataBound");
    });
</script>
In this article
Not finding the help you need? Improve this article