剔除选中/取消选中所有组合框答案

【问题标题】：knockout check/uncheck all combo box剔除选中/取消选中所有组合框
【发布时间】：2012-01-31 14:49:43
【问题描述】：

我使用敲除将 JSON 对象映射到用户控件，我有一个单个复选框的列表，他们看起来像

 <input type="checkbox" data-bind="checked: IsEnabled1" />

我有 JsonObject

 var viewModel = {
            IsEnabled1 :ko.observable(true),            
            IsEnabled2 :ko.observable(true),
            IsEnabled3 :ko.observable(false)
        };
  ...
  ko.applyBindings(viewModel);

我想添加将选中/取消选中所有其他复选框的全局复选框，我在 JavaScript 端进行了此更改，但全局复选框更新了 UI 部分，但它们来自单独复选框的数据不会映射到 JSON 对象。

全局复选框

  $("#GeneralTable thead tr th:first input:checkbox").click(function () {
            var checkedStatus = this.checked;
            $("#GeneralTable tbody tr td:first-child input:checkbox").each(function () {
                this.checked = checkedStatus;                    
            });

        });

在此代码之后，我的 JSON 对象包含与 UI 无关的数据。

从JS端更改复选框后如何更新所有JSON？

【问题讨论】：

您发布的代码不足以让我们回答您的问题。
现在应该会更好。谢谢。
代码中存在与节点交互的问题。但是您需要与数据进行交互。它在 MVVM 世界中更好:-) 请检查我的答案。我认为它对你有用。

标签： javascript jquery knockout.js

【解决方案1】：

请查看示例：http://jsfiddle.net/MenukaIshan/5gaLjh2c/

我认为这正是您所需要的。所有项目都具有IsChecked 可观察属性。 ViewModel 包含计算的 observable（可读和可写）来检查或取消选中所有项目。

【讨论】：

这是一个完美的使用例子。让我的一天两次！
处理类似的代码。我试过你的小提琴，但在我的情况下，我使用的是 knockout-3.2.0.js 并且它不起作用（即使在小提琴中），但使用的是 knockout-2.0.0.js。任何线索。
jsfiddle 示例 404 的。
jsfiddle 很好用！

【解决方案2】：

这里有一个替代解决方案http://jsfiddle.net/rniemeyer/kXYuU/

上面的解决方案可以通过两种方式改进

-为了使空列表的 AllChecked 为 false，我们需要检查长度

-为了减少长列表全选时的重新计算次数，我们需要添加油门

self.AllChecked = ko.computed({
    read: function() {
        var firstUnchecked = ko.utils.arrayFirst(self.Items, function(item) {
            return item.IsChecked() == false;
        });
        return self.Items.length && !firstUnchecked;
    },
    write: function(value) {
        ko.utils.arrayForEach(self.Items, function(item) {
            item.IsChecked(value);
        });
    }
}).extend({ throttle: 1 });

【讨论】：