ASP.NET MVC淘汰绑定不起作用

Question

我正在使用Mvc4 / bootstrap 3.2和淘汰赛3.2。 问题是我有一个表格。 文本框和按钮，在按钮上单击“我将文本框值传递给控制器​​”。 从控制器绑定viewModel与表接收数据后。 但是，表中的数据没有更新，mvc模型也没有更新。 提交数据时我已经检查过了。

ViewModel：我尝试了两种方式的ViewMoel

var SibviewModel=null;
    $(function () {
        var model = @Html.Raw(Json.Encode(Model));
        SibviewModel = ko.mapping.fromJS(model);
        ko.applyBindings(SibviewModel);
    });

function GetMatchingSibling(_Id) {
        var url = "/Home/GetStudentSiblingDetails/?Id=" + _Id;
        $("#myModal").modal('show');
        $.ajax({
            url: url,
            cache: false,
            type: "GET",
            success: function (data) {
                try {
                    $(data.data).each(function (index, element) {
                        SibviewModel.SibviewModel.push(element);
                    });
                    ko.applyBindings(viewModel);

                } catch (e) {
                    $(".alert-dismissable")
                    .alert('show')
                    .addClass("alert-danger")
                    .append("<h3>"+e+"</h3>");

                }
                finally {
                    $("#myModal").modal('hide');
                }


            },
            error: function (reponse) {
                alert("error : " + data.error);
                $("#myModal").modal('hide');
            }
        });
    }

然后我写了MVC Razor视图

<tbody data-bind="foreach: lookupCollection">
            @foreach (var item in Model.LinkedSiblings)
            {
                string dobval = "";
                if (Model.DOB.HasValue)
                {
                    dobval = Model.DOB.Value.ToString("dd-MM-yyyy");
                }

                @Html.HiddenFor(x => item.PhoneNo, new { @Name = "LinkedSiblings[" + item.DynamicControlId + "].PhoneNo", @Value = item.PhoneNo, data_bind = "value: PhoneNo" })
                @Html.HiddenFor(x => item.Email, new { @Name = "LinkedSiblings[" + item.DynamicControlId + "].Email", @Value = "santokh.hcl@hmail.com", data_bind = "value: Email" })
                @Html.HiddenFor(x => dobval, new { @Name = "LinkedSiblings[" + item.DynamicControlId + "].DOB", @Value = dobval, data_bind = "value: DOB" })
                @Html.HiddenFor(x => item.LastName, new { @Name = "LinkedSiblings[" + item.DynamicControlId + "].LastName", @Value = item.LastName, data_bind = "value: LastName" })
                <tr>
                    <td data-bind="text: StudentId">@Html.TextBoxFor(x => item.StudentId, new { style = "max-width:100px;", @Name = "LinkedSiblings[" + item.DynamicControlId + "].StudentId", @Value = item.StudentId, data_bind = "value: StudentId" })
                    </td>
                    <td>@Html.TextBoxFor(x => item.AdmissionId, new { style = "max-width:100px;", @Name = "LinkedSiblings[" + item.DynamicControlId + "].AdmissionId", @Value = item.AdmissionId, data_bind = "value: AdmissionId" })
                    </td>
                    <td>@Html.TextBoxFor(x => item.FirstName, new { style = "max-width:100px;", @Name = "LinkedSiblings[" + item.DynamicControlId + "].FirstName", @Value = item.FirstName, data_bind = "value: FirstName" })
                    </td>
                    <td>@Html.TextBoxFor(x => item.ClassId, new { style = "max-width:100px;", @Name = "LinkedSiblings[" + item.DynamicControlId + "].ClassId", @Value = item.ClassId, data_bind = "value: ClassId" })
                    </td>
                </tr>

            }
            @Html.EditorFor(x => Model.LinkedSiblings)
        </tbody>
    </table>

提交表单时，视图均不会使用“值”而不是“控制器方法上接收的值”更新。

Answer 1

在AJAX回调中调用ko.applyBindings有两个问题：

try {
    $(data.data).each(function (index, element) {
        SibviewModel.SibviewModel.push(element);
    });
    ko.applyBindings(viewModel);
}

第一个问题是您要传递未声明的变量viewModel （我看不到该声明）或包含旧数据（您在SibviewModel.SibviewModel更新了数据）

第二个问题是您不应调用ko.applyBindings 。 它将在剔除3.x中引发异常-您不能将两个viewModel绑定到同一元素。 也误解了基因敲除.js和数据绑定的基本概念。 如果修改模型，更改将自动传播到视图，您无需调用任何函数... ko.applyBindings仅用于初始化新绑定。 事实并非如此，您已有绑定，您只想更新模型。

也许还有另一个错误，我没有检查整个代码...

顺便说一句，您还有性能问题，请查看此文章-http: //www.knockmeout.net/2012/04/knockoutjs-performance-gotcha.html

Answer 2

  var viewModel = {
        lookupCollection: ko.observableArray()
    };
    var SibviewModel=null;
    $(function () {
        var model = @Html.Raw(Json.Encode(Model));
        SibviewModel = ko.mapping.fromJS(model);
        ko.applyBindings(SibviewModel);
    });

    function GetMatchingSibling(_Id) {
        var url = "/Home/GetStudentSiblingDetails/?Id=" + _Id;
        $("#myModal").modal('show');
        $.ajax({
            url: url,
            cache: false,
            type: "GET",
            success: function (data) {
                try {
                    $(data.data).each(function (index, element) {
                        SibviewModel.LinkedSiblings.push(element);
                    });
                    ko.applyBindings(LinkedSiblings);

                } catch (e) {
                    $(".alert-dismissable")
                    .alert('open')
                    .removeClass('alert-warning')
                    .addClass("alert-danger")
                    .append("<h3>"+e+"</h3>");   
                }
                finally {
                    $("#myModal").modal('hide');
                }
            },
            error: function (reponse) {
                alert("error : " + data.error);
                $("#myModal").modal('hide');
            }
        });
    }

：Jookyn。 我已经附上了用于更新List的完整JS代码。 在表的foreach循环中，我一直在使用“ LinkedSiblings”代替Lookup Collection