當我更改第一個下拉列表值時，如何重新填充另一個下拉列表？

我用下面的代碼來初始化我2下拉列表在我的Asp.net MVC操作：當我更改第一個下拉列表值時，如何重新填充另一個下拉列表？

ViewData["first"]=List<SelectListItem>(){...}; 
ViewData["second"]=List<SelectListItem>(){...};

，並顯示這兩個在我的Asp.net MVC視圖這樣的：

@Html.DropdownList(...,(List<SelectListItem>)ViewData["first"], ...); 
@Html.DropdownList(...,(List<SelectListItem>)ViewData["second"], ...);

上面的代碼工作好的，我想要做的是：當我改變第一個dropdownlist值時，第二個DropdownList會動態改變，我想應該用ajax來實現這個目標，但是我沒有進一步的想法。任何人都可以幫忙，提前謝謝!!!

來源

2013-08-30 paul cheung

我唯一能想到的就是使用Ajax。 –

聽取第一個下拉列表的更改事件，讀取選定的值，將其發送到一個操作方法，該操作方法返回第二個下拉內容的JSON數據。閱讀JSON並加載到第二個下拉列表。

$(function(){ 
    $("#CountryDropdDown").change(function(e){ 
    var country=$(this).val(); 
    $.getJSON("@Url.Action("States","Home")?id="+country,function(data){ 
     var items=""; 
     $.each(data,function(index,item){ 
      items+="<option value='"+item.ID+"'>"+item.Name+"</option>"; 
     });    
     $("#States").html(items); 
    }); 

    }); 
});

假設你的HomeController有一個叫美國的行動方法，它接受一個ID，並在下面的格式

[ 
    { "ID": "1", "Name": "MI" }, 
    { "ID": "2", "Name": "NY" } 
]

編輯返回JSON：按在評論

問題

假設你有像這樣的狀態實體的類。

public class StateVM 
{ 
    public int ID { set;get;} 
    public string Name { set;get;} 
}

因此，在操作方法，構建StateVM類的列表，並使用Json方法來創建JSON從數據。

public AtionResult States(int id) 
{ 
    var stateList=GetStatesForCountry(id); 
    return Json(stateList,JsonRequestBehavior.AllowGet); 
} 

private List<StateVM> GetStatesForCountry(id); 
{ 
    List<StateVM> states=new List<StateVM>(); 
    //Hard coding the items for demo. 
    // TO DO : Replace the below lines with code for reading 
    // your database and filling the list 

    states.Add(new StateVM { ID=1, Name="MI"}); 
    states.Add(new StateVM { ID=2, Name="NY"});  
    return states; 
}

來源

2013-08-30 17:42:49 Shyju

如何在Action中初始化這個Json數據？ var versions = new {ID =「version1」，Name =「version2」}; 或其他方式？ –

@paulcheung：請參閱答案 – Shyju

yap中的更新，我真的需要更新的內容。 –

當我更改第一個下拉列表值時，如何重新填充另一個下拉列表？

回答

相關問題