+1-888-365-2779
Try Now
More in this section

Forums / Developing with Sitefinity / Custom Menu Navigation Control

Custom Menu Navigation Control

12 posts, 0 answered
  1. Mateen
    Mateen avatar
    13 posts
    Registered:
    29 Aug 2012
    25 Nov 2013
    Link to this post
    Hi Team,

    I need to create custom menu navigation control using MVC thunder.
    Kindly help me by providing some code for that.



  2. Kaloyan
    Kaloyan avatar
    272 posts
    Registered:
    05 Dec 2016
    27 Nov 2013
    Link to this post
    Hi Mateen,

    In order to achieve your desired scenario you have to implement your custom solution. I believe that the following resources could be helpful.

    Creating MVC Widgets with Sitefinity Thunder

    Using ASP.NET MVC in Sitefinity

    Regards,
    Kaloyan
    Telerik
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Mateen
    Mateen avatar
    13 posts
    Registered:
    29 Aug 2012
    04 Dec 2013 in reply to Kaloyan
    Link to this post
    Hi Kaloyan,

    Thanks for the reply. Well I am aware of creating MVC widgets with Sitefinity.
    My issue was, I need to develop custom widget for Navigation control, Using Sitefinity API.
    I want to fetch all parent pages and their child pages upto "N" level, and want to present in View of MVC widget.

    Kindly help me with this.
    Thanks in advance.

    Regards,
    Mateen
  4. Doug
    Doug avatar
    7 posts
    Registered:
    01 Oct 2012
    19 May 2014
    Link to this post

    Has anyone done this yet? I'm not crazy about working with Webforms in our current environment, and I'd like to avoid reinventing the wheel, if possible.

  5. Nikola Zagorchev
    Nikola Zagorchev avatar
    424 posts
    Registered:
    24 Nov 2016
    22 May 2014
    Link to this post
    Hello,

    I have created a simple widget that uses the Page Manager and gets all pages and their children recursively. Then you can show them in the view. I have shown only the top 3 levels, however, you can define a recursive method that will show them all in the view, since all pages and children are saved in the Model.
    Result Mvc Nav; Result Built-in Nav;

    Controller (all pages are get to n levels in-depth):
    public class MVCNavigationController : Controller
       {
           public List<PageNodeModel> pagesAll = new List<PageNodeModel>();
           public List<PageNodeModel> nav = new List<PageNodeModel>();
           /// <summary>
           /// This is the default Action.
           /// </summary>
           public ActionResult Index()
           {
               var model = new MVCNavigationModel();
     
               var manager = PageManager.GetManager();
     
               var pages = manager.GetPageNodes()
                   .Where(n => n.ShowInNavigation == true && n.ApprovalWorkflowState == "Published" && n.ParentId == SiteInitializer.CurrentFrontendRootNodeId)
                   .Select(PageNodeModel.ToModel).ToList();
     
               pagesAll = pages;
     
               GetChildNodesRecursively(pagesAll);
     
               model.Nav = nav;
     
               return View("Default", model);
           }
     
           public void GetChildNodesRecursively(List<PageNodeModel> pagesToQuery)
           {
               var manager = PageManager.GetManager();
     
               foreach (var item in pagesToQuery)
               {
                   var pages = manager.GetPageNodes().Where(n => n.ShowInNavigation == true && n.ApprovalWorkflowState == "Published" && n.ParentId == item.Id)
                       .Select(PageNodeModel.ToModel)
                   .ToList();
                    
                    
                   if (pages != null)
                   {
                       if (item.ParentId == SiteInitializer.CurrentFrontendRootNodeId)
                       {
                           item.ChildNodes = pages;
                           nav.Add(item);
                       }
                       else
                       {
                           item.ChildNodes = pages;
                       }
                        
                       GetChildNodesRecursively(pages.ToList());
                   }
                   else
                   {
                       nav.Add(item);
                   }             
               }
           }
       }


    View (not used the recursive method for getting the items, only 3 levels shown):
    @model SitefinityWebApp.Mvc.Models.MVCNavigationModel
     
    @*three levels shown; the url are returned relative ('~/...'), so we get absolute*@
    @foreach (var item in Model.Nav)
    {
        <div>
            <a href="@item.Url.Substring(2, item.Url.Length - 2)">@item.Title</a>
            <div>
                @foreach (var child in item.ChildNodes)
                {
                    <a href="@child.Url.Substring(2, child.Url.Length - 2)" style="margin-left:30px">@child.Title</a>
             
                    foreach (var node in child.ChildNodes)
                    {
                    <div><a href="@node.Url.Substring(2, node.Url.Length - 2)" style="margin-left:60px">@node.Title</a></div>
                    }
                }
            </div>
        </div>
    }

    Model:
    public class MVCNavigationModel
        {
            public MVCNavigationModel()
            {
                this.Nav = new List<PageNodeModel>();
            }
     
            public List<PageNodeModel> Nav { get; set; }
        }
     
    public class PageNodeModel
        {
            public Guid Id { get; set; }
     
            public string Title { get; set; }
     
            public List<PageNodeModel> ChildNodes { get; set; }
     
            public PageNodeModel()
            {
                this.ChildNodes = new List<PageNodeModel>();
            }
     
            public Guid ParentId { get; set; }
     
            public string Url { get; set; }
     
            public static Func<PageNode, PageNodeModel> ToModel
            {
                get
                {
                    return pn => new PageNodeModel()
                    {
                        Id = pn.Id,
                        Url = pn.GetFullUrl(),
                        ParentId = pn.ParentId,
                        Title = pn.Title,
                    };
                }
            }
        }


    Regards,
    Nikola Zagorchev
    Telerik
     
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Sitefinity CMS Ideas&Feedback Portal and vote to affect the priority of the items
     
  6. Doug
    Doug avatar
    7 posts
    Registered:
    01 Oct 2012
    22 May 2014 in reply to Nikola Zagorchev
    Link to this post

    Thanks, Nikola. I'll try that out.

  7. Nikola Zagorchev
    Nikola Zagorchev avatar
    424 posts
    Registered:
    24 Nov 2016
    23 May 2014
    Link to this post
    Hi Doug,

    I hope the provided widget help you create your custom one and achieve what you wanted. You can use similar approach to the one for getting the pages initially, to create the method for iterating recursively the collection in the view. Write back if you need further assistance.

    Regards,
    Nikola Zagorchev
    Telerik
     
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Sitefinity CMS Ideas&Feedback Portal and vote to affect the priority of the items
     
  8. Doug
    Doug avatar
    7 posts
    Registered:
    01 Oct 2012
    23 May 2014 in reply to Nikola Zagorchev
    Link to this post

    That helped a lot, thank you. I have it mostly working now, but I can't see where you're getting the method GetFullUrl() for this line in the model:

        Url = pn.GetFullUrl() 

    Is there a Sitefinity assembly I should be using, or am I building that myself? I couldn't see it in Telerik.Sitefinity.Pages.Model.PageNode or your model code.

    Doug

  9. Nikola Zagorchev
    Nikola Zagorchev avatar
    424 posts
    Registered:
    24 Nov 2016
    23 May 2014
    Link to this post
    Hi Doug,

    You should add a reference to Telerik.Sitefinity.Modules.Pages to be able to use the extension method. Another option is to get the URL using the ContentLocationService, but this way you should iterate the pages and get them loaded in the memory:
    public static string ItemAbsoluteUrl(this PageNode node)
    {
        var url = SystemManager.GetContentLocationService().GetItemDefaultLocation(node, default(CultureInfo)).ItemAbsoluteUrl;
     
        return url;
    }

    You can find the above helpful for other content items, as well.

    Regards,
    Nikola Zagorchev
    Telerik
     
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Sitefinity CMS Ideas&Feedback Portal and vote to affect the priority of the items
     
  10. Doug
    Doug avatar
    7 posts
    Registered:
    01 Oct 2012
    27 May 2014 in reply to Nikola Zagorchev
    Link to this post

    Ah, that's the piece I was missing, thanks! The Telerik.Sitefinity.Modules.Pages reference worked perfectly.

  11. Joel Kinzel
    Joel Kinzel avatar
    35 posts
    Registered:
    16 Jul 2009
    17 Apr 2015
    Link to this post

    Just wanted to make a note on this: The posted MVC solution doesn't seem to take into account permissions.

     What would be great is if we could see the included MVC navigation widget code. It is really close to what I need, but isn't quite there.

  12. Nikola Zagorchev
    Nikola Zagorchev avatar
    424 posts
    Registered:
    24 Nov 2016
    20 Apr 2015
    Link to this post
    Hello Joel,

    The forum thread is quite old. It is much better to use the built-in Mvc navigation widget coming with Feather. Another option is to built your own navigation using the Sitemap provider since its much faster than querying the pages through the manager plus uses caching. You can also use a helper to recursively show the nodes. You can view a sample in this blog post.

    Regards,
    Nikola Zagorchev
    Telerik
     
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Sitefinity CMS Ideas&Feedback Portal and vote to affect the priority of the items
     
12 posts, 0 answered