This is a migrated thread and some comments may be shown as answers.

Sitemap bound Menu and Client Side Routing

1 Answer 113 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Tony
Top achievements
Rank 1
Tony asked on 24 Apr 2015, 06:35 PM

I have a sitemap bound kendo menu in my layout page that correctly displays the menu items in the ul as shown below. Although this works great for an mvc app with normal back end routing it doesnt work for client side routing such as the one provided by angular or others. Because im trying to build a spa I need the href to be #/controller/action. Is there any way to do this.  

 Server wrapper:

 @(Html.Kendo().Menu()
                             .Name("SiteNav")
                             .Direction(MenuDirection.Bottom)
                             .SecurityTrimming(true)
                             .BindTo("WebSiteMap", (item, siteMapNode) => { })
                            )

 

Generated html:

<ul class="k-widget k-reset k-header k-menu" id="SiteNav">
    <li class="k-item k-state-highlight k-state-default"><a class="k-link" href="/">Home<span class="k-icon k-i-arrow-s"></span></a><ul class="k-group k-menu-group">
        <li class="k-item k-state-default"><a class="k-link" href="/Home/Contact">Contact</a></li>
    </ul>
    </li>
    <li class="k-item k-state-highlight k-state-default"><a class="k-link" href="/">Home 2</a></li>
</ul>

 

sitemap:

 

<?xml version="1.0" encoding="utf-8" ?>
<siteMap>
  <siteMapNode title="" description="" roles="*">
    <siteMapNode title="Home" controller="Home" action="Index">
      <siteMapNode title="Contact" controller="Home" action="Contact" />
      <siteMapNode title="About" controller="Home" action="About"  roles="Admin"/>
    </siteMapNode>
    <siteMapNode title="Home 2" controller="Home" action="Index">
    </siteMapNode>
  </siteMapNode>

</siteMap>

1 Answer, 1 is accepted

Sort by
0
Daniel
Telerik team
answered on 28 Apr 2015, 03:54 PM
Hello,

You can use the url attribute instead of controller and action to set the needed URL in the sitemap:
<siteMapNode title="Home" url="#/Home/Index" >
Another option would be to set the URL using the overload of the BindTo method that accepts the key and an action:
.BindTo("WebSiteMap", (item, node) =>
{
  if (!string.IsNullOrEmpty(item.ActionName))
  {
      item.Url = "#" + Url.Action(item.ActionName, item.ControllerName);   
  
})


Regards,
Daniel
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Menu
Asked by
Tony
Top achievements
Rank 1
Answers by
Daniel
Telerik team
Share this question
or