Question

我刚开始玩Knockout.js，看起来真的很酷。我有一个网格。此网格有一个列，顶部有一个复选框，用于“选择所有”元素，以及取消选择。标准网格行为。

到目前为止，这是我的代码：

使用Javascript：

// Define a "banner" class
function banner(inventory, name, artType, artSize) {
    return {
        isSelected : ko.observable(false),
        inventory : ko.observable(inventory),
        name : ko.observable(name),
        artType : ko.observable(artType),
        artSize : ko.observable(artSize)

    };
}

var viewModel = {
    banners : ko.observableArray([new banner("network", "Banner #1"), new banner("oo", "Banner #2")]),
    addBanner : function() {
        this.banners.push(new banner("network", "Banner"));
    },
    selectAll : function() {
        this.banners.isSelected(true)
    }       

};

ko.applyBindings(viewModel);

我将“selectAll”事件绑定到这样的复选框：

<th><input data-bind="click: selectAll" type="checkbox" /></th>

对于我在列表中的每个横幅，他们的复选框如下所示：

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

由于某种原因，我的selectAll功能无法正常工作。我对这个OO javascript编程范例相当新，所以我可能会在这里做一些明显错误的事情。

谢谢！

Answer 1

在这种情况下，

banners是一个数组，因此您需要访问数组中的每个项目并更新单个isSelected属性。

类似的东西：

ko.utils.arrayForEach(this.banners(), function(banner) {
   banner.isSelected(true);
});

Answer 2

以下链接有更多功能性回复。当取消选中其他复选框时，它取消选择“全选”框：

knockout check/uncheck all combo box

Knockout.js“全选”复选框

2 个答案: