2013-09-05 32 views
1

我在視圖上有兩個選擇列表。我需要根據第一個選擇列表的選定項目的值填充第二個選擇列表的項目,而不發佈整個頁面。什麼是最好的方式來實現這一點?如何根據從同一視圖上的另一個選擇列表中選擇的項目填充MVC選擇列表?

這裏是在視圖中選擇列表:

   <tr> 
       <td> 
        <div class="editor-label"> 
         @Html.LabelFor(model => model.PersonnelAreaID) 
        </div> 
       </td> 
       <td> 
        <div class="editor-field"> 
         @Html.DropDownListFor(model => model.PersonnelAreaID, TLMS_DropDownLists.PersonnelAreas) 
        </div> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <div class="editor-label"> 
         @Html.LabelFor(model => model.SupervisorID) 
        </div> 
       </td> 
       <td> 
        <div class="editor-field"> 
         @Html.DropDownListFor(model => model.PersonnelAreaID, TLMS_DropDownLists.ApprovingAuthorities) 
        </div> 
       </td> 
      </tr> 

以下是我與當前填充它們的方法:

 public static List<SelectListItem> PersonnelAreas 
    { 
     get 
     { 
      List<SelectListItem> personnelAreas = new List<SelectListItem>(); 
      personnelAreas.Add(new SelectListItem { Value = "", Text = "" }); 
      foreach (PersonnelArea pa in PersonnelArea.GetAllPersonnelAreas()) 
      { 
       personnelAreas.Add(new SelectListItem { Value = pa.AreaID.ToString(), Text = pa.AreaTitle }); 
      } 
      return personnelAreas; 
     } 
     private set { } 
    } 

     public static List<SelectListItem> ApprovingAuthorities 
    { 
     get 
     { 
      List<SelectListItem> returned = new List<SelectListItem>(); 
      returned.Add(new SelectListItem { Text = "", Value = "" }); 
      foreach (Employee item in Employee.GetAllEmployees().Where(e => e.UserRoleID == 2 || e.UserRoleID == 5)) 
      { 
       returned.Add(new SelectListItem { Text = string.Format("{0} {1}", item.FirstName, item.LastName), Value = item.ID.ToString() }); 
      } 
      return returned; 
     } 
     private set { } 
    } 

我需要ApprovingAuthorities選擇列表僅適用於展示到人事區。

+0

你可以包括你到目前爲止的代碼? – Paddyd

+0

@ Ajax.BeginForm。 – melancia

+0

或者使用簡單的$ .ajax調用您的控制器中的Action,它將返回一個jSON結果或整個HTML列表,並將其替換爲第二個選擇列表的列表 – LoSTxMiND

回答

2

「最好」的方式可能是意見的問題,但一個好的方法是使用AJAX填充第二個下拉列表。

雖然第一個下拉列表可以填充靜態數據,但第二個可以通過生成填充第二個的客戶端JavaScript代碼或通過對返回JSON的Controller方法執行AJAX調用來填充,然後用這些數據填滿第二個下拉菜單。

這是一篇很好的文章:「與MVC 4和jQuery級聯下拉列表」,地址爲http://www.sidecreative.com/Blog/Entry/Cascading-dropdown-lists-with-MVC4-and-jQuery

祝你好運!

+0

感謝您的鏈接。我會看看。 – Bazinga

+0

網址現在好像被打破了 – Muflix

0

您也可以使用SignalR填充第二個組合框。你可以按照一個很好的教程here

相關問題