鏈接Razor的項目DropDownLists

Question

我有3個DropDownLists;當我在＃1中選擇一個項目時，我希望根據＃1的值填充＃2中的項目。當我在＃2中選擇一個項目時，＃3中的項目應該根據＃2中的選擇填充。它們都位於名爲GetItemsForLeve1的表單中。我已經開始使用下拉式的onchange。

<% using (Html.BeginForm("GetItemsForLeve1", "Index")) 
    { %>    
     Main Group: <%:Html.DropDownList("Level1", (SelectList)ViewBag.Level1, "Select One", new { onchange = "$this.form.submit()" })%> 
     <%:Html.DropDownList("Level2", (SelectList)ViewBag.Level2, "-", new { onchange = "$this.form.submit()" })%> 
     <%:Html.DropDownList("Level3", (SelectList)ViewBag.Level3, "-", new { onchange = "$this.form.submit()" })%> 
     <input type="submit" value="Filter" /> 
    <%}%> 

1. 是否有可能來填補2級和3級下拉列表不發送頁面返回到服務器？

2. 如何判斷在GetItemsForLevel操作中點擊了哪個下拉列表？ 我對MVC完全陌生，所以我很欣賞以簡單的方式告訴我？

謝謝

Answer 1

據我知道，真的有沒有，這是否對你的組件。但是你可以使用Ajax.BeginForm幫手來構建它。

1. 第一AJAX形式應當包含在第一選擇列表，併發送回一個返回部分視圖的動作
2. 1中的局部視圖應該與第二選擇列表
返回第二個AJAX形式
3. 等等

所以主要Razor視圖應該包含這樣的事情：

@using (Ajax.BeginForm("SecondAjaxForm", new AjaxOptions() { UpdateTargetId = "secondFormDiv" }) 
{ 
    @Html.DropDownList("selectList1", Model.FirstSelectList, new { onchange = "this.form.submit()") 
} 

<!-- the second AJAX form + drop-down list will get populated here 
<div id="secondFormDiv"></div> 

而SecondAjaxForm動作：

public ActionResult SecondAjaxForm(string selectList1) 
{ 
    SelectList secondSelectList; 
    // populate the second select list here 
    return PartialView("SecondAjaxForm", secondSelectList); 
} 

的局部視圖SecondAjaxForm應基本與上述相同的第一種形式。

@model SelectList 
@using (Ajax.BeginForm("ThirdAjaxForm", new AjaxOptions() { UpdateTargetId = "thirdFormDiv" }) 
{ 
    @Html.DropDownList("selectList2", Model, new { onchange = "this.form.submit()") 
} 

<!-- the third AJAX form + drop-down list (if any) will get populated here 
<div id="thirdFormDiv"></div>