【发布时间】：2017-08-29 09:07:07
【问题描述】：
在我的项目中，我使用了 jquery ajax 的级联下拉列表，它可以工作，但我需要将第二个下拉列表更改为复选框，以根据从第一个下拉列表中选择的地区以及项目选择城市使用复选框选中需要保存在数据库中。但我是 MVC 的新手，我无法以正确的方式提供复选框的代码。
控制器
public ActionResult Create()
{
ViewBag.DistrictId = new SelectList(db.DistrictMasters, "Id", "DistrictName");
return View();
}
public JsonResult GetPosts(string id)
{
List<SelectListItem> posts = new List<SelectListItem>();
var postList = this.Getpost(Convert.ToInt32(id));
var postData = postList.Select(m => new SelectListItem()
{
Text = m.PostName,
Value = m.Id.ToString(),
});
return Json(postData, JsonRequestBehavior.AllowGet);
}
public IList<PostMaster> Getpost(int DistrictId)
{
return db.PostMasters.Where(m => m.DistrictID == DistrictId).ToList();
}
[HttpPost]
[ValidateAntiForgeryToken]
public async Task<ActionResult> Create([Bind(Include = "Id,PostId,DistrictId")] Agent agent, FormCollection formdata)
{
if (ModelState.IsValid)
{
db.Agents.Add(agent);
await db.SaveChangesAsync();
return RedirectToAction("Index");
}
return View(agent);
}
查看创建
@model A.Models.Agent
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.LabelFor(model => model.PostMaster.DistrictID, "DistrictName", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("DistrictId", ViewBag.DistrictId as SelectList, "-- Please Select --", new { style = "width:250px" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.PostId, "PostName", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("PostMaster", new SelectList(string.Empty, "Value", "Text"), "-- Please select --", new { style = "width:250px", @class = "dropdown1" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
}
<script type="text/javascript">
$(document).ready(function () {
//District Dropdown Selectedchange event
$("#DistrictId").change(function () {
$("#PostMaster").empty();
$.ajax({
type: 'POST',
url: '@Url.Action("GetPosts")', // Calling json method
dataType: 'json',
data: { id: $("#DistrictId").val() },
// Get Selected post id.
success: function (posts) {
$.each(posts, function (i, post) {
$("#PostMaster").append('<option value="' + post.Value + '">' +
post.Text + '</option>');
});
},
error: function (ex) {
alert('Failed to retrieve post.' + ex);
}
});
return false;
})
});
我认为这部分我需要在 jquery 中更改，但我无法做到
success: function (posts) {
$.each(posts, function (i, post) {
$("#PostMaster").append('<option value="' + post.Value + '">' +
post.Text + '</option>');
});
},
<div class="form-group">
@Html.LabelFor(model => model.PostId, "PostName", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("PostMaster", new SelectList(string.Empty, "Value", "Text"), "-- Please select --", new { style = "width:250px", @class = "dropdown1" })
</div>
</div>
这是我的代码的一部分。谁能帮我找到解决办法
【问题讨论】：
-
不清楚你想做什么。您是否要为与所选地区关联的每个城市生成一个复选框，以便您可以选择多个城市？
-
是的，当我选择地区时，我希望城市作为复选框
标签： jquery ajax asp.net-mvc checkbox drop-down-menu