剔除复选框绑定，具有自动更新功能答案

【问题标题】：Knockout checkbox binding, with autoupdate剔除复选框绑定，具有自动更新功能
【发布时间】：2014-02-14 21:56:02
【问题描述】：

我正在尝试当一个人更改以前绑定的复选框的状态时，我想用新值更新服务器。所以这就是我所拥有的：

JSCRIPT

function JobViewModel() {
        var self = this;
        var baseUri = '/Api/Pedidos/';

        self.TotalItems = ko.observable(@Model.TotalItems);
        self.AbreviaNome = ko.observable(@Model.AbreviaNome.ToString().ToLower());
        self.AbreviaFantasia = ko.observable(@Model.AbreviaFantasia.ToString().ToLower());

        self.update = function () {
            alert('Boom');
            $.ajax({
                type: "PUT",
                url: baseUri,
                data: self.Job,
                datatype: "json",
                contenttype: "application/json"
            })
                .done(function (data) {
                    //handleSuccessFunctionHERE(data);
                    alert('Magic');
                })
                .error(function (jqXHR, textStatus, errorThrown) {
                    alert(errorThrown);
                    alert("fail");
                });
        };
    }

    function JobDetailsViewModel() {
        var self = this;
        var baseUri = '/Api/Pedidos/';
        self.Job = new JobViewModel();

    }

HTML

<label class="btn btn-primary" data-bind="css: {active:Job.AbreviaNome }">
      <input type="checkbox" data-bind="checked: AbreviaNome , onchange: Job.update" name="type" id="AbreviaNome "> Nome</input>
</label>

这永远不会触发更新功能。我也试过：

<label class="btn btn-primary" data-bind="css: {active:Job.AbreviaNome }">
      <input type="checkbox" data-bind="checked: AbreviaNome , click: Job.update" name="type" id="AbreviaNome "> Nome</input>
</label>

这在 JobViewModel 中：

this.AbreviaNome.subscribe(function (newValue) {                
      alert('test');
}, this);

有什么想法吗？

【问题讨论】：

标签： asp.net-mvc knockout.js asp.net-web-api

【解决方案1】：

您应该为此使用 subscribe 而不是 onchange 处理程序。您提到您尝试过，但是您订阅了 AbreviNome 而不是 AbreviaLogradouro。

【讨论】：

修复了示例，因为您提到了我正在绑定的字段上的错误。

【解决方案2】：

解决了问题，下面是绑定：

 <label class="btn btn-primary " data-bind="css: {active:Job.AbreviaNome}">
     <input type="checkbox" data-bind="checked: Job.AbreviaNome, event: {change: Job.update}" name="type" id="AbreviaNome">Nome/Razão</input>
 </label>

不确定这是最好的方法，但它确实有效。

【讨论】：

避免使用更改事件绑定。你不需要它。您应该以淘汰方式处理更改 - 使用订阅。
我正在尝试，但它不工作，它不会失败，或任何东西。当我在 subscribe 方法上设置断点时，它永远不会触发