jquery - Ajax 调用未绑定(bind)所有模型属性

Question

我将根据下拉列表中的选择使用jquery创建表。当我在下拉列表中选择任何选项时，屏幕上将生成空白表。但是当我在空白表中插入值并按提交时在行动中，我得到了模型，但该模型仅包含我从 Ajax 添加的表中的属性。但是它忽略了我首先选择的下拉列表的值。如果我删除该 ajax 成功代码，那么它会为模型提供正确的值，但是我不会在 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>');
                }
            }
        });
    });

这是我的 View 模型:

 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>();   
        }

    }

这是 View 模型中的导航属性类:

 public class CriteriaCommentViewModel
    {
        public int Id { get; set; }
        public string Comment { get; set; }
    }

这是 View :

@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>

这是我要发布值的 Controller 操作:

  [HttpPost]
        public ActionResult AddNomination(NominationViewModel model)
        {
            return RedirectToAction("Dashboard", "Dashboard");
        }

请提出解决此问题的方法。提前致谢

Answer 1

您的 View 模型不包含名为 Model 的属性，因此您需要将生成表 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." 前缀。