Question

使用固定标题行实现列级过滤器时，如何返回部分匹配的单元格？

即：搜索词：“omato”

返回：automator，番茄等。

Answer 1

在示例中的MyFilter下替换此循环...

for (var columnId in columnFilters) {
    if (columnId !== undefined && columnFilters[columnId] !== "") {
        var c = grid.getColumns()[grid.getColumnIndex(columnId)];
        if (item[c.field] != columnFilters[columnId]) {
            return false;
        }
    }
}

用这个..

for (var columnId in columnFilters) {
    if (columnId !== undefined && columnFilters[columnId] !== "") {
        var c = grid.getColumns()[grid.getColumnIndex(columnId)];
        if (item[c.field].indexOf(columnFilters[columnId]) == -1) {
            return false;
        }
    }
}

现在似乎很明显：）

Answer 2

以下是我用来实现此目的的coffeescript代码：

filterGrid = (item) ->
    return true unless hasFilter
    grid.setSelectedRows([])
    columns = grid.getColumns()
    for columnId, filter of columnFilters
        if filter? 
            column = columns[grid.getColumnIndex(columnId)]
            field = item[column.field]
            return false unless (field? && field.toLowerCase().indexOf(filter.toLowerCase()) > -1) 
    return true

在应用过滤器之前，行grid.setSelectedRows([])只会清除所有选定的行。如果不这样做，那么您在屏幕上看到的选定行与基础选定行不匹配。

更重要的是，return true unless hasFilter行会阻止网格加载时的任何过滤工作，除非用户实际输入了其中一个框。我发现，当通过http批量加载JSON数据中的大型数据集时，这对网格的性能产生了很大的影响。

以下是设置hasFilter标志的输入框处理程序：

$(grid.getHeaderRow()).delegate(':input', 'change keyup', (e) ->
    columnId = $(this).data('columnId')
    if columnId?
        columnFilters[columnId] = $.trim($(this).val())
        hasFilter = true
        dataView.refresh()
)

如何使用列级标题过滤Slickgrid时执行部分匹配？

2 个答案: