.net基于MVC多个下拉框DropDownList联动

 

这里用MVC3.0为例

要达到的效果是，点击一个下拉框，则另一个下拉框的值发生对应变化。如：选择中国，则另个一下拉框里显示中国各个省份。

这里用的是jquery，涉及到了ajax.

接下来看代码

View：

<script>
$(function(){
$("#ORG3").change(function(){ //ORG3选项改变时激活
var selec = $(this).val(); //获取改变的选项值
var url = "@Url.Action("GetBZ", "TianChuang", new { area = "SGManage" })";//参数依次类型(action,Controller,area）

$("#ORG4").find("option").remove(); //清空

$.getJSON(url, { 'orgID': selec }, function (data) {//orgID是参数名和Controllers中的action参数名相同
$.each(data, function (i, item) {
$("<option></option>").val(item["Value"]).text(item["Text"]).appendTo($("#ORG4"));
}); //如果url访问成功 则执行function(data)这个函数（看仔细了，这里该函数也是.getJSON的第三个参数）
}); //function(data)获取了通过url返回来的值，并且循环读取出来
});
});
</script>
@Html.DropDownListFor(m => m.ORG3, CheJian, new { style = "width: 100px;" })
@Html.DropDownListFor(m => m.ORG4,BanZu, new { style = "width: 100px;" })

Controllers：
//JsonResult继承了ActionResult

public JsonResult GetBZ(int orgID) //GetBZ对应View的GetBZ，orgID也是通过View可以获取参数值
{
var d = Organization.GetOrgSelectList1(orgID, OrgLayer.工区);
return Json(d, JsonRequestBehavior.AllowGet);

//这里的代码是封装过的，可以在这里写任何想要的代码
//注意，由于是列表框 所以返回的值应该是List<SelectListItem>(也许不只一种传递类型)
}