2013-05-12 69 views
2

我想通過多級動態菜單進行循環。我已經成功地做到這一點手動,即每次如果要顯示其父母的孩子Menus,我必須手動循環。 我想知道通過這些動態菜單循環多層次的最佳方式或替代方法 這是我迄今爲止所做的;在Asp.Net MVC中循環多級動態菜單

@{ var menusList = ViewBag.Menus as IEnumerable<ParentMenuViewModel>; } 
@foreach (var parentMenu in menusList.Where(p => p.ParentId == 0)) 
{ 
    <ul> 
     <li> 
      <h1>@parentMenu.Name</h1> 
      @if (menusList.Count(p => p.ParentId == parentMenu.MenuId) > 0) 
      { 
       <ul> 
        @foreach (var childMenu in menusList.Where(p => p.ParentId == parentMenu.MenuId)) 
        { 
         <h2>@childMenu.Name</h2> 
         if (menusList.Count(p => p.ParentId == childMenu.MenuId) > 0) 
         { 
          foreach (var subChild in menusList.Where(p => p.ParentId == childMenu.MenuId)) 
          { 
           <h3>@subChild.Name</h3> 
          } 
         } 
        } 
       </ul> 
      } 
     </li> 
    </ul> 

} 

UPDATE:輸出看起來是這樣的;

HOME 
SUB MENU1 
    SUB SUB MENU1 
    SUB SUB MENU2 

但是,我在我的數據庫中有這樣的東西;

HOME 
SUB MENU1 
    SUB SUB MENU1 
    SUB SUB MENU2 
    Sub SUB SUB MENU1 
    Sub SUB SUB MENU2 

這是我的模型;
enter image description here

回答

5

您可以使用partialview然後做一個遞歸循環。爲了做到這一點你首先需要改變你的模型中位:

視圖模型

// The ViewModel is now a hirearchical model, where each item has a list of children. 
public class MenuViewModel 
{ 
    int MenuId {get; set;} 
    string Name {get; set;} 
    //other properties 
    ** snip ** 
    List<MenuViewModel> Children {get; set;} 
} 

控制器

變換模式進入層次視圖模型:

public ActionResult Menus(){ 
    List<Menu> menusource; // get your menus here 
    ViewBag.Menus = CreateVM(0, menusource); // transform it into the ViewModel 
    return View(); 
} 

public IEnumerable<MenuViewModel> CreateVM(int parentid, List<Menu> source) 
{ 
    return from men in source 
      where men.ParentId = parentid 
      select new MenuViewModel(){ 
         MenuId = men.MenuId, 
         Name = men.Name 
         // other properties 
         Children = CreateVM(men.MenuId, source) 
        }; 
} 

查看

@{ 
    var menusList = ViewBag.Menus as IEnumerable<MenuViewModel>; 
    Html.RenderPartial("MenuPartial", menuslist); 
} 

MenuPartial

@model IEnumerable<MenuViewModel> 

@foreach (var menuitem in model) 
{ 
    <ul> 
     <li> 
      <h1>@menuitem.Name</h1> 
      @{ 
       Html.RenderPartial("MenuPartial", menuitem.Children); 
      } 
     </li> 
    </ul> 
} 

,你會在這裏與問候你的原始代碼唯一缺少的是,你不必不同HX-標籤,但你能找到一種方法通過創建另一個視圖模型並將其傳遞給當前級別。

注意:我在SO編輯器中輸入了所有這些代碼,所以可能會有一些小的語法錯誤。

+1

根據我的需要修改它,它工作。謝謝 – 2013-05-12 10:54:13

+0

你可以使它asycronous(你的代碼)。我試過但沒有成功。使用異步並等待關鍵字 – 2013-05-19 13:25:46