KnockoutJS：使用 ko.toJSON(this) 时初始值不会发布到服务器？答案

【问题标题】：KnockoutJS : initial values are not posted to server when using ko.toJSON(this)?KnockoutJS：使用 ko.toJSON(this) 时初始值不会发布到服务器？
【发布时间】：2012-01-02 17:45:37
【问题描述】：

我已经定义了这个 javascript 视图模型：

function PersonViewModel() {
    // Data members
    this.Name = ko.observable();
    this.Function_Id = ko.observable();
    this.SubFunction_Id = ko.observable();
    this.Functions = ko.observableArray();
    this.SubFunctions = ko.observableArray();

    // Whenever the Function changes, update the SubFunctions selection
    this.Function_Id.subscribe(function (id) {
        this.GetSubFunctions(id);
    }, this);

    // Functions to get data from server
    this.Init = function () {
        this.GetFunctions();
        this.Function_Id('@(Model.Function_Id)');
    };

    this.GetFunctions = function () {
        var vm = this;

        $.getJSON(
            '@Url.Action("GetFunctions", "Function")',
            function (data) {
                vm.Functions(data);
            }
        );
    };

    this.GetSubFunctions = function (Function_Id) {
        var vm = this;
        if (Function_Id != null) {
            $.getJSON(
                '@Url.Action("GetSubFunctions", "Function")',
                { Function_Id: Function_Id },
                function (data) {
                    vm.SubFunctions(data);
                }
            );
        }
        else {
            vm.SubFunction_Id(0);
            vm.SubFunctions([]);
        }
    };

    this.Save = function () {
        var PostData = ko.toJSON(this);

        var d = $.dump(PostData);
        alert(d);

        $.ajax({
            type: 'POST',
            url: '/Person/Save',
            data: PostData,
            contentType: 'application/json',
            success: function (data) {
                alert(data);
            }
        });
    };
}

$(document).ready(function () {
    var personViewModel = new PersonViewModel();
    personViewModel.Init();

    ko.applyBindings(personViewModel);
});

单击“提交”按钮时，会发布选择列表中的数据，但不会发布“Function_Id”。

当我在 Function 下拉列表中选择不同的值并单击 Submit 按钮时，'Function_Id' 的值已正确发布。

如何解决这个问题？

【问题讨论】：

Function_Id 不是this.Function_Id，它只是传递给同名函数的参数。

标签： forms post knockout.js

【解决方案1】：

这是因为javascript中this关键字的作用域

this.Init = function () {
    this.GetFunctions(); // this === PersonViewModel.Init
    this.Function_Id('@(Model.Function_Id)'); // calls PersonViewModel.Init.Function_Id(...)
};

您应该将引用存储到 PersonViewModel 实例。

var self = this;
self.Init = function () {
    self.GetFunctions();
    self.Function_Id('@(Model.Function_Id)'); // calls PersonViewModel.Function_Id(...)
};

【讨论】：