Telerik Extensions for ASP.NET MVC
Contents

This topic shows how to use Telerik Menu for ASP.NET MVC in an ASP.NET MVC application.

Important

All Telerik UI components need a ScriptRegistrar component in order to output their JavaScript objects and register their JavaScript files. The ScriptRegistrar component should be defined *after* all other UI components in the page. If you create the components on the client-side and do not use the MVC extensions, you need to manually register all requried JavaScript files. For further information check this help topic (Step 4 - Register Scripts)

Prerequisites

Before proceeding make sure that:
  • You have all the required components installed.
  • Make sure that your ASP.NET MVC project refers the Telerik.Web.Mvc.dll assembly and you have a ScriptRegistrar and a StyleSheetRegistrar defined in your application (either in the master page or in the view where you are going to use Telerik Menu for ASP.NET MVC).
  • All required JavaScript and CSS files are properly copied to your project. This is outlined in here - steps 4 and 5.

Menu definition

The Menu is made of MenuItem objects. Here is how to define a simple Telerik Menu for ASP.NET MVC with two items:

CopyView
<%= Html.Telerik().Menu()
        .Name("Menu")
        .Items(items =>
        {
            items.Add().Text("Item 1");
            items.Add().Text("Item 2");
        })
%>

And now the explanation of that code:

  • The Name is used to specify the unique name of the menu which is later output as the id HTML attribute and used by Telerik Extensions for ASP.NET MVC. Setting the name is mandatory and exception would be thrown otherwise.
  • The Items method is used to define the items of the menu. The passed action sets the properties of the items.
  • The Add method adds new MenuItem object to the menu.
  • The Text method sets the text displayed by the MenuItem object.
  • The Content method is used to specify the content of the MenuItem object.
  • Finally the Render method outputs the HTML of the menu.
    Important
    It is mandatory that the Render method is called. If not the component will not output any HTML.

See Also