Question

[UPDATE]

我做了之后： http://dojo.telerik.com/aqIXa 当我单击例如ProductName过滤器，然后选择并取消选择所有项目时，转到其他字段示例单价，单击选择并取消选择所有我转回到产品名称字段，现在在过滤器中：

您可以看到再次创建了Select All组合框，并且在重复这些步骤后它将继续创建。有没有人知道为什么会这样？

我目前正在Kendo工作并尝试为每列进行自定义网格过滤。我用这个例子：

http://dojo.telerik.com/iwAWU

我添加了initCheckboxFilter函数，它创建了select all的复选框。

var selectAllCheckbox= $("<div><input type='checkbox' id='checkAll' checked/> Select All</div>").insertBefore(".k-filter-help-text");

在我实施的那个功能之外：

function clickMe(){
   $("#checkAll").click(function () {
    if ($("#checkAll").is(':checked')) {
        $(".book").prop("checked", true);
    } else {
        $(".book").prop("checked", false);
    }
});
}

（。book是里面的模板类：

 var element = $("<div class='checkbox-container'></div>").insertAfter(helpTextElement).kendoListView({
          dataSource: checkboxesDataSource,
          template: "<div><input type='checkbox' class='colDefFilter'  value='#:" + field + "#' checked />#:" + field + "#</div>",
        });

）

我还添加了UnitPrice和UnitInStock字段：

function onFilterMenuInit(e) {
        debugger;
        if (e.field == "ProductName" || "UnitPrice" || "UnitInStock") {
          initCheckboxFilter.call(this, e);

        }
      }

这看起来像：

我第一次点击某些列过滤器上的全选复选框时，它会检查并取消选中所有项目，它可以正常工作。当我尝试在其他列上执行此操作时，事件不会触发。有谁知道出了什么问题？谢谢！

Answer 1

您的问题是您使用id for check all复选框，这就是为什么jquery总是从第一个下拉菜单中选择复选框（产品）

你需要使用checkAll作为类而不是id，然后像这样更改你的clickMe（）函数，它将起作用：

function clickMe(){
       $(".checkAll").click(function () {
        if ($(this).is(':checked')) {
           $(this).closest('.k-filter-menu').find(".book").prop("checked", true);
        } else {
            $(this).closest('.k-filter-menu').find(".book").prop("checked", false);
        }
    });
    }

以下是工作示例http://dojo.telerik.com/aqIXa

修改：

您使用的方式添加全选复选框应该是这样的

var selectAllCheckbox= $("<div><input type='checkbox' class='checkAll' checked/> Select All</div>").insertBefore(e.container.find(".k-filter-help-text"));

这是

的内容

var selectAllCheckbox= $("<div><input type='checkbox' id='checkAll' checked/> Select All</div>").insertBefore(".k-filter-help-text");

否则它将为先前初始化的过滤器下拉列表添加多个“全选”复选框。

以下是更新的演示：http://dojo.telerik.com/aqIXa/4

Kendo UI - 自定义网格过滤器：复选框在每次点击时都不起作用

1 个答案: