在我的项目中,我使用级联下拉列表使用jQuery的ajax,它的工作原理,但我需要将第二个下拉列表更改为复选框来选择城市根据所选区从第一个下拉列表以及使用复选框选择的项目需要保存在数据库中。但我是MVC和Iam的新手,无法以正确的方式给出复选框的代码。将下拉列表更改为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>
这是我的我的代码的一部分。任何人都可以请帮我找到解决办法
不清楚你想要做什么。您是否想要为与所选区域相关联的每个城市生成一个复选框,以便您可以选择多个城市? –
是的,当我选择分区我想城市复选框 – user256