在MVC4中使用Razor语法,一使用就爱上他了,
一般项目都是有一些增删改查功能,表单下拉框是经常使用的,除了用原始的<select>外,还可以用@Html.DropDownList和@Html.DropDownListFor,这里提供一点方法;
在控制器中定义两种可生成下拉列表项方法:
ViewBag.list = new SelectList(list.Select(x => x.Address).Distinct());
ViewBag.down = new SelectList(list.Select(x => new { text = x.Address, value = x.Id }), "value", "text");
ViewData["downlist"]= list.Select(x=>new SelectListItem() { Text=x.Address,Value=x.Id.ToString()});
在网页中可以按如下写法
@Html.DropDownList("down",@Model.Address)
@Html.DropDownListFor(x=>x.Id,ViewBag.down as IEnumerable<SelectListItem>)
@Html.DropDownListFor(x=>x.Id, ViewData["downlist"] as IEnumerable<SelectListItem>)
如果我们想在DropDownList中的最顶端添加一个默认值的话,请模仿下面的写法:添加第三个参数
@Html.DropDownListFor(x=>x.Id,ViewBag.down as IEnumerable<SelectListItem>, "---Select---") 如果想在DropDownListFor中添加自己的ID属性,可以这样
@Html.DropDownListFor(x=>x.Id,ViewBag.down as IEnumerable<SelectListItem>,new{id="userid"})
如果是两级下拉级联菜单可以使用jquery的ajax:
$("#parentDep").change(function () {
var $this = $(this);
var id = $this.val();
$this.next("select").remove();
$("#depid").val(id);
if (id.length > 0) {
$.getJSON("/users/getSubDep/" + id, "", function (data) {
if (data.length > 0) {
var sel = $('<select id="subDep" name="subDep" class="form-control" style="width: 200px; display: inline-block;"><option value=""></option></select>');
for (var i = 0; i < data.length; i++) {
sel.append('<option value="' + data[i].id + '">' + data[i].text + '</option>');
}
sel.change(function () {
$("#depid").val(sel.val());
});
$this.after(sel);
}
});
}
});
public ActionResult getSubDep(int id = 0)
{
if (!Request.IsAjaxRequest())
{
return Content("非法操作");
}
var res = db.departments.Where(x => x.depparentid == id);
if (res == null)
{
return Content("");
}
else
{
return Json(res.Select(x => new { id = x.id, text = x.depname }), JsonRequestBehavior.AllowGet);
}
}