Specifying an Area when binding a menu to a model

[Darryl]

How do you specify an area when binding to a model?  I'm working on an ASP.NET MVC website using Areas, and using the Kendo().Menu() helper to build the menu.  I'm using the BindTo() method to bind the menu to a model that is based on Kendo.MVC.UI.MenuItem.  How do I tell the helper which area (i.e. which route) to use, and how do I specify that a particular controller is NOT in any of the areas.  The following example code example might help to illustrate the problem I'm having:

using System.Collections.Generic;
using System.Web.Routing;
using My.Resources.Views.Shared;
using Kendo.Mvc.UI;

namespace My.Web.Configuration
{
    public class MyMenuItem: Kendo.Mvc.UI.MenuItem
    {
        public int Id { get; set; }
        public IEnumerable<MyMenuItem> SubItems { get; set; }
    }

    public class MySiteMap
    {
        public MySiteMap()
        {
            MenuItems = new List<MyMenuItem>
            {
                // There is an AccountController in an Area named 'Admin'

                // Neither one of the following approaches works. I think I'm close here, but I'm missing something
                // new MyMenuItem { Text = "Log In", ControllerName="Account", ActionName="Login", RouteName = "Admin"},
                // new MyMenuItem { Text = "Log In", ControllerName="Account", ActionName="Login", RouteValues = new RouteValueDictionary(new {area = "Admin"})},

                // The following line works the first time you click on it, but an error occurs the second
                // time, or when you try to navigate anywhere else, because the helper appends all links
                // to the Area name, once you've navigated to said area (e.g. "Home" becomes "Admin/Home"
                // which is incorrect).
                new MyMenuItem { Text = MenuResources.MenuLogin, ControllerName="Admin/Account", ActionName="Login" },

                // How do I tell the Kendo().Menu() helper that the 'Home' controller, e.g., is not located
                // in the 'Admin' area?
                new MyMenuItem { Text = MenuResources.MenuAbout, ControllerName="Home", ActionName="About" },
                new MyMenuItem
                {
                    Text = MenuResources.MenuProjects, ControllerName="Projects",
                    ActionName="Index",
                    SubItems = new List<MyMenuItem>
                    {
                        new MyMenuItem{Text = MenuResources.MenuProjectX,  ControllerName="Projects", ActionName="ProjectX"},
                        new MyMenuItem{Text = MenuResources.MenuProjectY, ControllerName="Projects", ActionName="ProjectY"}
                    },
                },
                new MyMenuItem { Text = MenuResources.MenuNotesToSelf, ControllerName="Blog", ActionName="Index" }
            };
            SiteMapName = "Root"; // Never displayed
        }

        public string SiteMapName { get; set; }
        public IEnumerable<MyMenuItem> MenuItems { get; set; }
    }

}

[Daniel]

Hello,

The menu uses the MVC built-in routing so an area can be specified the same way as with the built-in MVC helpers - by adding a route value with key "area":

new MyMenuItem
{
    ControllerName="controller",
    ActionName="action",
    RouteValues = new RouteValueDictionary
    {
        {"area", "areaname"}
    }
}

No area can be specified by using empty string for the value.


Regards,
Daniel
Telerik

 

 

[Sebastian]

Hi, 

i have done the same way, in my razor file the menu is

@(Html.Kendo().Menu()
    .Name("Menu42")  
    .DataUrlField("Url")
    .DataSpriteCssClassField("SpriteCssClasses")
    .DataTextField("Text") 
    .DataSource(ds => ds.Read("GetMenuItems", "Home", new { Area = "" })
    .Model(model => model.Children("Items")))
 )

when i check the RouteValues object with the developer tools in my web browser i see that the object is initialized correctly (its empty like you mentioned)

But the problem persists, when i change the area, the current areaname is incorrectly prefixed to all URLs in the menu. Is there something missing in my razor view?

Cheers for now

 

[Alexander]

Hi Sebastian,

Thank you for reaching out.

Since the .DataUrlField() API is being utilized, a possible recommendation would be to compose the "Url" field by the Url.Action Helper in the following manner:

var data = new List<MyMenuItem>
{
    new MyMenuItem
    {
        Text = "MenuProjects", ControllerName="Projects",
        ActionName="Index",
        Url = Url.Action("About", "Home", new {area = "MyArea"}),
        SubItems = new List<MyMenuItem>
        {
            new MyMenuItem{Text = "MenuY",  ControllerName="Projects", ActionName="ProjectX"},
            new MyMenuItem{Text = "MenuX", ControllerName="Projects", ActionName="ProjectY"}
        },
    }
    
}.ToList();

[Darryl]

Yup, Daniel.  That did it.

Thanks