Friday, 12 September 2014

Multilevel Menu in mvc 3.0

table structure

MenuId    MenuName    MenuOrder    MainMenuId    ControllerName    ActionName    LinkName
1               Home                   1               NULL                   Controller1          Index               Home
2             Microsoft              2               NULL                   Controller2           Index           Microsoft
3             Windows               1                 2                          Controller1           Index            Windows
4             WindowsXP           1                3                           Controller1          Index          Windows XP
5               Windows7            2                3                            Controller2          Index         Windows 7
6            Windows8              3                3                            Controller1           Index         Windows 8
7              MS Office            2                2                             Controller1          Index          MS Office
8               Apple                 3                NULL                     Controller1          Index            Apple
9            IPhone                  1                   8                            Controller1          Index             IPhone
10          IPad                      2                8                             Controller1          Index             IPad
11          MacAir                 3                8                              Controller1         Index           Mac AirNot

=========================================================================
controller

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MultilevelMenu.Models;

namespace MultilevelMenu.Controllers
{
    public class MenuController : Controller
    {
        MenuEntities MEnt = new MenuEntities();

        [ChildActionOnly]
        public ActionResult Menus()
        {
            var mMenu = MEnt.Menu.ToList();
            return PartialView(mMenu);
        }

    }
}
============================================================
model

using System.Data.Entity;
using System.Data.Mapping;

namespace MultilevelMenu.Models
{
    public class MenuEntities : DbContext
    {
        public DbSet<Menus> Menu { get; set; }
    }
}
==============================================================
Menus.cshtml

@model IEnumerable<MultilevelMenu.Models.Menus>
<div>
    @Html.Raw(@Html.ParentMenus(Model))
</div>
=============================================================
.cs file

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.ComponentModel.DataAnnotations;

namespace MultilevelMenu.Models
{
    [Table("Menus")]
    public class Menus
    {
        [Key]
        public int MenuId { get; set; }
        public string MenuName { get; set; }
        public int MenuOrder { get; set; }
        public int? MainMenuId { get; set; }
        public string LinkName { get; set; }
        public string ActionName { get; set; }
        public string ControllerName { get; set; }
    }

}
================================================================
htmlhelper class

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Mvc.Html;
using MultilevelMenu.Models;

namespace MultilevelMenu.HtmlHelpers
{
    public static class HtmlHelperExtensions
    {
        public static string ParentMenus(this HtmlHelper html, IEnumerable<Menus> menu)
        {
            string htmlOutput = string.Empty;

            if (menu.Count() > 0)
            {
                htmlOutput += "<ul class='sf-menu'>";
                var MainMenu = from mainMenu in menu where mainMenu.MainMenuId == null orderby mainMenu.MenuOrder select mainMenu;
                foreach (Menus m in MainMenu)
                {
                    htmlOutput += "<li>";
                    htmlOutput += LinkExtensions.ActionLink(html, m.LinkName, m.ActionName, m.ControllerName);
                    htmlOutput += SubMenus(html, menu, m.MenuId);
                    htmlOutput += "</li>";
                }
                htmlOutput += "</ul>";
            }
            return htmlOutput;
        }

        private static string SubMenus(this HtmlHelper html, IEnumerable<Menus> SubMenu, int MenuId)
        {
            string htmlOutput = string.Empty;
            var subMenu = from sm in SubMenu where sm.MainMenuId == MenuId orderby sm.MenuOrder select sm;
            if (subMenu.Count() > 0)
            {
                htmlOutput += "<ul>";
                foreach (Menus m in subMenu)
                {
                    htmlOutput += "<li>";
                    htmlOutput += LinkExtensions.ActionLink(html, m.LinkName, m.ActionName, m.ControllerName);
                    htmlOutput += SubMenus(html, SubMenu, m.MenuId);
                    htmlOutput += "</li>";
                }
                htmlOutput += "</ul>";
            }
            return htmlOutput;
        }

        //private static string SubMenus(IEnumerable<Menus> iEnumerable)
        //{
        //    throw new NotImplementedException();
        //}
    }
}
=================================================================
Output like this:

Multilevel Menu


No comments:

Post a Comment