Model Binding

The Kendo UI Menu enables you to bind it to a hierarchical model.

To perform model binding:

  1. Make sure you followed all the steps from the introductory article on Telerik UI for ASP.NET Core.
  2. Create a new action method and pass the Categories table as the model. Note that the Categories must be associated to the Products table.

    public ActionResult Index()
        NorthwindDataContext northwind = new NorthwindDataContext();
        return View(northwind.Categories);
  3. Make your view strongly typed.

    @model IEnumerable<MvcApplication1.Models.Category>
  4. Add a Menu.

        .Name("menu") //The name of the Menu is mandatory. It specifies the "id" attribute of the widget.
        .BindTo(Model, mappings =>
            mappings.For<category>(binding => binding //Define the first level of the Menu.
                .ItemDataBound((item, category) => //Define the mapping between the Menu item properties and the model properties.
                    item.Text = category.CategoryName;
                .Children(category => category.Products)); //Define which property of the model contains the children.
            mappings.For<product>(binding => binding
                .ItemDataBound((item, product) =>
                    item.Text = product.ProductName;

See Also

In this article
Not finding the help you need? Improve this article