Ajax 调用未绑定所有模型属性
Ajax call is not binding all model properties
我将在下拉列表中的 selection 的基础上使用 jquery 创建 table..当我 select 下拉列表中的任何选项空白 table 将在屏幕上生成..但是当我在空白 table 中插入值并按提交然后在行动中我得到了模型但该模型仅包含我从中添加的 table 中的属性Ajax..但它忽略了我首先 selected 的下拉列表的值..如果我删除那个 ajax 成功代码,那么它会为模型提供适当的值,但我不会在 Table 创建者 ajax 成功....
这是我的 ajax 代码:
$("#Award").change(function () {
var selectdAward = $("#Award").val();
$('#criteriaTable').empty();
var ServiceUrl = "/Nomination/CriteriasForAward?awardId=" + selectdAward;
$.ajax({
type: 'post',
url: ServiceUrl,
contentType: "application/json; charset=utf-8",
error: function (xhr, err) {
alert(xhr.responseText)
},
success: function (data) {
$('#criteriaTable').append('<tr><th>Id</th><th>Criteria-Description</th><th>Comment</th></tr>');
for (var key in data) {
$('#criteriaTable tr:last')
.after('<tr><td><label>' + data[key].Id + '</label></td>'
+ '<td><label>' + data[key].Title + '</label></td>'
+ '<td><input type="text" name=Model.Comments[' + key + '].Comment></td>'
+ '<td><input type="hidden" name=Model.Comments[' + key + '].Id value=' + data[key].Id + '></td></tr>');
}
}
});
});
这是我的视图模型:
public class NominationViewModel
{
public int AwardId { get; set; }
public int ManagerId { get; set; }
public int UserId { get; set; }
public int ProjectID { get; set; }
public string SelectResourcesBy { get; set; } //from project or from department
public IList<CriteriaCommentViewModel> Comments { get; set; }
public NominationViewModel()
{
Comments = new List<CriteriaCommentViewModel>();
}
}
这是导航 属性 class 在视图模型中:
public class CriteriaCommentViewModel
{
public int Id { get; set; }
public string Comment { get; set; }
}
这是观点:
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.Label("Nomination Category", htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-8">
@Html.DropDownListFor(model => model.AwardId, @ViewBag.Awards as SelectList, "Select", new { htmlAttributes = new { @class = "form-control" }, id = "Award" })
@Html.ValidationMessageFor(model => model.AwardId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.Label("Resource From", htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-8">
<label> @Html.RadioButtonFor(model => model.SelectResourcesBy, "Project", new { htmlAttributes = new { @class = "form-control" } })Project</label>
<label> @Html.RadioButtonFor(model => model.SelectResourcesBy, "Department", new { htmlAttributes = new { @class = "form-control" } })Department</label>
@Html.ValidationMessageFor(model => model.UserId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.Label("Project", htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-8">
@Html.DropDownListFor(model => model.ProjectID, @ViewBag.ProjectsUnderCurrentUser as SelectList, "Select", new { htmlAttributes = new { @class = "form-control" }, id = "SelectedProject" })
@Html.ValidationMessageFor(model => model.ManagerId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.Label("Resource Name", htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-8">
@Html.DropDownListFor(model => model.UserId, @ViewBag.Resources as SelectList, "Select", new { htmlAttributes = new { @class = "form-control" }, id = "Resources" })
@Html.ValidationMessageFor(model => model.UserId, "", new { @class = "text-danger" })
</div>
</div>
<br />
<br />
<hr />
<div class="form-group">
@Html.Label("Criteria", htmlAttributes: new { @class = "control-label col-md-2" })
<br />
<div class="form-group">
<div id="Criterias">
<table border="1" id="criteriaTable"></table>
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="button" value="Save Draft" class="btn btn-default" />
<input type="submit" value="Submit" class="btn btn-default" />
<input type="button" value="Cancel" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
这是我要发布值的控制器操作:
[HttpPost]
public ActionResult AddNomination(NominationViewModel model)
{
return RedirectToAction("Dashboard", "Dashboard");
}
请提出解决此问题的方法..在此先感谢
您的视图模型不包含名为 Model
的 属性,因此您需要将生成 table html 的代码修改为
for (var key in data) {
$('#criteriaTable tr:last')
.after('<tr><td><label>' + data[key].Id + '</label></td>'
+ '<td><label>' + data[key].Title + '</label></td>'
+ '<td><input type="text" name=Comments[' + key + '].Comment></td>'
+ '<td><input type="hidden" name=Comments[' + key + '].Id value=' + data[key].Id + '></td></tr>');
}
即从输入的 name
属性中删除 "Model."
前缀。
我将在下拉列表中的 selection 的基础上使用 jquery 创建 table..当我 select 下拉列表中的任何选项空白 table 将在屏幕上生成..但是当我在空白 table 中插入值并按提交然后在行动中我得到了模型但该模型仅包含我从中添加的 table 中的属性Ajax..但它忽略了我首先 selected 的下拉列表的值..如果我删除那个 ajax 成功代码,那么它会为模型提供适当的值,但我不会在 Table 创建者 ajax 成功....
这是我的 ajax 代码:
$("#Award").change(function () {
var selectdAward = $("#Award").val();
$('#criteriaTable').empty();
var ServiceUrl = "/Nomination/CriteriasForAward?awardId=" + selectdAward;
$.ajax({
type: 'post',
url: ServiceUrl,
contentType: "application/json; charset=utf-8",
error: function (xhr, err) {
alert(xhr.responseText)
},
success: function (data) {
$('#criteriaTable').append('<tr><th>Id</th><th>Criteria-Description</th><th>Comment</th></tr>');
for (var key in data) {
$('#criteriaTable tr:last')
.after('<tr><td><label>' + data[key].Id + '</label></td>'
+ '<td><label>' + data[key].Title + '</label></td>'
+ '<td><input type="text" name=Model.Comments[' + key + '].Comment></td>'
+ '<td><input type="hidden" name=Model.Comments[' + key + '].Id value=' + data[key].Id + '></td></tr>');
}
}
});
});
这是我的视图模型:
public class NominationViewModel
{
public int AwardId { get; set; }
public int ManagerId { get; set; }
public int UserId { get; set; }
public int ProjectID { get; set; }
public string SelectResourcesBy { get; set; } //from project or from department
public IList<CriteriaCommentViewModel> Comments { get; set; }
public NominationViewModel()
{
Comments = new List<CriteriaCommentViewModel>();
}
}
这是导航 属性 class 在视图模型中:
public class CriteriaCommentViewModel
{
public int Id { get; set; }
public string Comment { get; set; }
}
这是观点:
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.Label("Nomination Category", htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-8">
@Html.DropDownListFor(model => model.AwardId, @ViewBag.Awards as SelectList, "Select", new { htmlAttributes = new { @class = "form-control" }, id = "Award" })
@Html.ValidationMessageFor(model => model.AwardId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.Label("Resource From", htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-8">
<label> @Html.RadioButtonFor(model => model.SelectResourcesBy, "Project", new { htmlAttributes = new { @class = "form-control" } })Project</label>
<label> @Html.RadioButtonFor(model => model.SelectResourcesBy, "Department", new { htmlAttributes = new { @class = "form-control" } })Department</label>
@Html.ValidationMessageFor(model => model.UserId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.Label("Project", htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-8">
@Html.DropDownListFor(model => model.ProjectID, @ViewBag.ProjectsUnderCurrentUser as SelectList, "Select", new { htmlAttributes = new { @class = "form-control" }, id = "SelectedProject" })
@Html.ValidationMessageFor(model => model.ManagerId, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.Label("Resource Name", htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-8">
@Html.DropDownListFor(model => model.UserId, @ViewBag.Resources as SelectList, "Select", new { htmlAttributes = new { @class = "form-control" }, id = "Resources" })
@Html.ValidationMessageFor(model => model.UserId, "", new { @class = "text-danger" })
</div>
</div>
<br />
<br />
<hr />
<div class="form-group">
@Html.Label("Criteria", htmlAttributes: new { @class = "control-label col-md-2" })
<br />
<div class="form-group">
<div id="Criterias">
<table border="1" id="criteriaTable"></table>
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="button" value="Save Draft" class="btn btn-default" />
<input type="submit" value="Submit" class="btn btn-default" />
<input type="button" value="Cancel" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>
这是我要发布值的控制器操作:
[HttpPost]
public ActionResult AddNomination(NominationViewModel model)
{
return RedirectToAction("Dashboard", "Dashboard");
}
请提出解决此问题的方法..在此先感谢
您的视图模型不包含名为 Model
的 属性,因此您需要将生成 table html 的代码修改为
for (var key in data) {
$('#criteriaTable tr:last')
.after('<tr><td><label>' + data[key].Id + '</label></td>'
+ '<td><label>' + data[key].Title + '</label></td>'
+ '<td><input type="text" name=Comments[' + key + '].Comment></td>'
+ '<td><input type="hidden" name=Comments[' + key + '].Id value=' + data[key].Id + '></td></tr>');
}
即从输入的 name
属性中删除 "Model."
前缀。