首页 > 代码库 > asp.net mvc中 下拉框联动效果 添加方法

asp.net mvc中 下拉框联动效果 添加方法

首页查询第一级菜单的所有集合List,取到第一级的第一个下标,根据第一个下标查询第二级集合。

这样在页面就显示了 两个下拉select菜单,默认是从数据库查询的是第一个。

根据下拉框选择相应的第二级数据,在页面上面需要写一个ajax提交方法,

$(function () {
$(‘#sltCampus‘).on(‘change‘, function() {
$.ajax({
type: "POST",
url: ‘/Member/GetRestaurant‘,
data: { campusId: $(this).val() },
dataType: "json",
success: function (obj) {
if (obj.Result) {
var html = ‘‘;
for (var i = 0; i < obj.List.length; i++) {
html += ‘<option value="http://www.mamicode.com/‘ + obj.List[i].RestaurantId + ‘">‘ + obj.List[i].Name + ‘</option>‘;
}
// alert(html);
$(‘#sltRest‘).html(html);
}
}
});
});

 

方法提交到控制器方法,方法里面根据campusId来获取第二级的集合。

if (xRe.List(campusId, out resturant))
{
xLog.AddLine("List Success.");

var list = resturant.Select(x => new
{
RestaurantId = x.RestaurantId,
Name = x.Name,
});//投影
return Json(new { Result = true, List = list });
}

 

asp.net mvc中 下拉框联动效果 添加方法