Ajax調用一次

Question

的情況下觸發多次是，即時通訊基本上試圖創建4名的下拉列表中，當一個人改變了重新填充。又名過濾器級聯，彼此。

所以我決定把它在一個Ajax調用。基本上，它需要參數，決定應該返回哪些選擇列表。然後用新的下拉菜單替換舊的4個下拉菜單。 （替換當前部分與新的部分）

除，由於某種原因，我得到它調用控制器一次..然後兩次..然後4倍..等。如果舊的未刪除/替換。只是被隱藏了？..

在視覺上，我看到什麼標識期望。下拉菜單會改變選擇選項。

下面

是代碼。 （PS對不起，如果一些變量名是錯別字，他們已經改變了這裏張貼）

控制器：

public class Filter 
    { 
     public IEnumerable<SelectListItem> List1; 
     public IEnumerable<SelectListItem> List2; 
     public IEnumerable<SelectListItem> List3; 
     public IEnumerable<SelectListItem> List4; 
    } 

    public ActionResult GlobalFilter(String l1, String l2, String l3, String l4) 
    { 
     Filter filter = new Filter(); 

     filter.List1 = ...selectList 

     filter.List2 = ...selectList 

     filter.List3 = ...selectList 

     filter.List4 = ...selectList 

     return PartialView(filter); 
    } 

觀點：

<div id="filterPartial"> 

     @Html.Action("GlobalFilter", "Header") 
    </div> 

局部視圖：

@model ns.Controllers.HeaderController.Filter 

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script> 

@using (Ajax.BeginForm("GlobalFilter", "Header", new AjaxOptions { UpdateTargetId = "filterPartial" })) 
{ 

    @Html.DropDownList("l1", Model.List1, new { }) 
    @Html.DropDownList("l2", Model.List2, new { }) 

    @Html.DropDownList("l3", Model.List3, new { }) 
     @Html.DropDownList("l4", Model.List4, new { }) 

} 
<script type="text/javascript"> 
    $('#l1').change(function() { 
     $(this).parents('form').submit(); 
    }); 
</script> 

Answer 1

將此部分移到您的部分之外：

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script> 

我也搬到外面的部分，以及改變腳本，並改變它來處理動態內容，像這樣：

<script type="text/javascript"> 
    $('#filterPartial').on('change', '#l1', function() { 
     $(this).closest('form').submit(); 
    }); 
</script>