mleibman/SlickGrid 添加清除按钮答案

【问题标题】：mleibman/SlickGrid Adding clear buttonmleibman/SlickGrid 添加清除按钮
【发布时间】：2014-11-08 17:04:23
【问题描述】：

如何在 mleibman/SlickGrid 中重置搜索选项我想添加一个清除过滤器按钮。

只是想知道他有没有可用的内置函数，或者我们需要编写一个自定义功能

【问题讨论】：

【解决方案1】：

这是它的一个简短版本，我也对其进行了测试。

// remove the text inside each search input fields
$('.slick-headerrow-column').children().val('');

// empty out all column filters within the columnFilters object & refresh dataview
for (var columnId in columnFilters) {
    columnFilters[columnId] = "";
}
dataView.refresh();

columnFilters 变量非常重要，但可能会根据您的代码命名不同，但如果您查看此 Slickgrid Example，您会发现它被定义为 var columnFilters = {};，然后确保您拥有这段代码：

$(grid.getHeaderRow()).delegate(":input", "change keyup", function (e) {
  var columnId = $(this).data("columnId");
  if (columnId != null) {
    columnFilters[columnId] = $.trim($(this).val());
    dataView.refresh();
  }
});

这会将您的所有输入附加到对象变量columnFilters... 然后只有在您可以使用我提供的代码之后（在我测试时它对我有用）

【讨论】：

这行得通吗？我没有看到您回复任何内容...+1 也很好:)
我今天试过了。它工作正常，但网格没有刷新任何想法
嗯，有几个选项.. 你清除浏览器缓存了吗？但我猜这是问题，因为您没有 columnFilters 变量，或者您的代码中有不同的名称。 Firebug（Firefox 扩展）是否会给您任何 javascript 错误？我将编辑我的答案，应该在哪里找到 columnFilters var

【解决方案2】：

答案有效，但如果页面上有多个 SlickGrid，您可能会遇到问题。

$('.slick-headerrow-column').children().val('');

将为页面上的所有网格重置所有过滤器。另一种选择是使用：

if ($(grid.getHeaderRow())) {
    $(grid.getHeaderRow()).find("input").val("");
}

grid 是您的 SlickGrid 组件的名称。这只会重置该网格。

其余代码：

for (var columnId in columnFilters) {
    columnFilters[columnId] = "";
}

为我工作！

【讨论】：