Rendering a view with HtmlHelper and Partial Page in ASP.Net MVC3

Question

Hello in my project i have to implement Dynamic Menu using ASP.NET MVC3 Razor ..My menu structure is

1.UserManagement 1.1Create new user 1.2Create new Role 2.Accounts 2.1Income 2.2Expense

For the above structure i have a layout page ( with css and scripts) and its working fine. The problem is that in my view page menu is not displaying in a correct format .there are two HtmlHelperExtensions one is for Main Menu and other is for Sub menu.Both are initialized in Menus.cshtml as partial page

@model IEnumerable<Elixir.Models.Menus>

<div>
    @Html.Raw(@Html.ParentMenus(Model))



    </div>

    <div>

    @Html.Raw(@Html.SubMenu(Model,3))
    </div>

Updated Partial Code Code

@model IEnumerable<Elixir.Models.Menus>


    @Html.Raw(@Html.ParentMenus(Model))

    @foreach (var menuitem in Model)
    {


        <div>
         @Html.Raw(@Html.ParentMenus(Model))
        </div>
        <div>
        @if (menuitem.MainMenuId == menuitem.MenuId)
        {
            int ab = Convert.ToInt32(menuitem.MainMenuId);
    @Html.Raw(@Html.SubMenu(Model, ab))
        }
    </div>

    }

How to call sub menu dynamically when parent menu is called.Here am explicitly assigning the Main Menu Id as "3" to Submenu.?

How to connect parent Menus Html helper with submenu?

HtmlHelper Extension Code

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

namespace Elixir.HtmlHelpers
{
    public static class HtmlHelperExtensions
    {
        public static string ParentMenus(this HtmlHelper html,IEnumerable<Elixir.Models.Menus> menu)
        {
            string htmloutput=string.Empty;
            if (menu.Count() > 0)
            {
                htmloutput += "<ul class='side-navigation accordion' id='nav-accordion'>";
                var MainMenu = from mainMenu in menu where mainMenu.MainMenuId == null orderby mainMenu.MenuOrder select mainMenu;
                foreach (Menus m in MainMenu)
                {
                    htmloutput += "<li>";
                    htmloutput += "<li><i class='icon-home'>";
                    htmloutput += LinkExtensions.ActionLink(html, m.LinkName, m.ActionName, m.ControllerName);
                    htmloutput += "</li>";
                    htmloutput += "</li></i>";
                }
                htmloutput += "</ul>";
            }

            return htmloutput;

        }

        public static string SubMenu(this HtmlHelper html, IEnumerable<Menus> SubMenu, int MenuId)
        {
            string htmlOutput = string.Empty;
            if (SubMenu.Count() > 0)
            {
                htmlOutput += "<ul class='side-navigation accordion' id='nav-accordion'>";
                var subMenu = from SMenu in SubMenu where SMenu.MainMenuId == MenuId orderby SMenu.MenuOrder select SMenu;
                foreach (Menus m in subMenu)
                {
                    htmlOutput += "<li>";
                    htmlOutput += "<li><i class='icon-home'>";
                    htmlOutput += LinkExtensions.ActionLink(html, m.LinkName, m.ActionName, m.ControllerName);
                    htmlOutput += "</li>";
                    htmlOutput += "</li></i>";
                }
                htmlOutput += "</ul>";
            }
            return htmlOutput;
        }

    }
}

My Index View Code

@{
    ViewBag.Title = "Elixir ERP V1.0 Beta";
    Layout = "~/Views/Shared/_LayoutUser.cshtml";
}
<div class="main-container">
    <div class="main-wrapper">
        <div class="scroll-top">
            <a href="#" class="tip-top" title="Go Top"><i class="icon-arrow-up"></i></a>
        </div>
        <div class="left-bar merge-left">
            <!-- SEARCH BAR -->
            <!-- LEFT NAV -->
          @section leftnav{

             <div class="left-nav">
             @Html.Action("Menus");
  </div>



          }
        </div>
    </div>
    <div class="container">
    </div>
</div>

Answer 1

You could loop the menu items and pass in the MainMenuId like this:

@foreach(var menuItem in Model)
{

    <div>
    @Html.Raw(@Html.ParentMenus(menuItem))
    </div>
    <div>
    @Html.Raw(@Html.SubMenu(menuItem, menuItem.MainMenuId))
    </div>

}