视图:
@Html.DropDownList("province", ViewBag.dropDownListItems as IEnumerable<SelectListItem>, new { name = "prov" })
<select id="city" name="city" data-role="city"><option value="">- 市 -</option></select>
<select id="district" name="district" data-role="district"><option value="">县区</option></select>
视图JS:
<script type="text/javascript">
$("#province").change(
function () {
GetDirector($(this).val());
}
);
$("#city").change(
function () {
GetDirector1($(this).val());
}
);
function GetDirector(message) {
var ddl = $("#city");
var flag = 0;
var firstkey = '';
var option = {
url: '/Exchange/CityJsonResult',
type: 'get',
chche: false,
dataType: 'json',
data: { provinceId: message }, //发送服务器数据
success: function (data) { //成功事件
$("#city").empty();
var result = eval(data);
$(result).each(function (key) {
var opt = $("<option></option>").text(result[key].Name).val(result[key].ID);
ddl.append(opt);
if (flag == 0)
{
firstkey = result[key].ID;
flag = 1;
}
});
GetDirector1(firstkey);
},
error: function (XMLHttpRequest, textStatus, errorThrown) { //发送失败事件
alert(textStatus);
}
};
//进行异步传输
$.ajax(option);
};
function GetDirector1(message) {
var district = $("#district");
var option = {
url: '/Exchange/CityJsonResult1',
type: 'get',
chche: false,
dataType: 'json',
data: { provinceId: message }, //发送服务器数据
success: function (data) { //成功事件
$("#district").empty();
var result = eval(data);
$(result).each(function (key) {
var opt = $("<option></option>").text(result[key].Name).val(result[key].ID);
district.append(opt);
});
},
error: function (XMLHttpRequest, textStatus, errorThrown) { //发送失败事件
alert(textStatus);
}
};
//进行异步传输
$.ajax(option);
};
</script>
控制器接收及返回数据:
public string CityJsonResult()
{
int provinceId = Request["provinceId"].ParseTo<int>(1);
List<District> proviceList = new DistrictService().GetList(provinceId, 2);
Response.ContentType = "application/json";
return HalfBuy.Biz.Utilities.JSONHelper.ObjectToJSON(proviceList);
}
public string CityJsonResult1()
{
int provinceId = Request["provinceId"].ParseTo<int>(1);
List<District> proviceList = new DistrictService().GetList(provinceId, 3);
Response.ContentType = "application/json";
return HalfBuy.Biz.Utilities.JSONHelper.ObjectToJSON(proviceList);
}