Question

请帮助解决这个非常烦人的问题。我正在使用for循环迭代数据数组并创建多个网格。它运行良好，但过滤器功能没有正确绑定（它只绑定到创建的LAST网格）这是代码：

// this function iterates over the data to build the grids
function buildTables() {

// "domain" contains the dataset array
for (i = 0; i < domains.length; i++) {
    var dataView;
    dataView = new Slick.Data.DataView();
    var d = domains[i];
    grid = new Slick.Grid('#' + d.name, dataView, d.columns, grids.options);
    var data = d.data;


    // create a column filter collection for each grid - this works fine
    var columnFilters = columnFilters[d.name];

    // this seems to be working just fine
    // Chrome console confirms it is is processed when rendering the filters
    grid.onHeaderRowCellRendered.subscribe(function (e, args) {
        $(args.node).empty();
        $("<input type='text'>")
           .data("columnId", args.column.id)
           .val(columnFilters[args.column.id])
           .appendTo(args.node);
    });

    // respond to changes in filter inputs
    $(grid.getHeaderRow()).delegate(":input", "change keyup", function (e) {
        var columnID = $(this).data("columnId");
        if (columnID != null) {

            // this works fine - when the user enters text into the input - it 
            // adds the filter term to the filter obj appropriately
            // I have tested this extensively and it works appropriately on 
            // all grids (ie each grid has a distinct columnFilters object
            var gridID = $(this).parents('.grid').attr('id');
            columnFilters[gridID][columnID] = $.trim($(this).val());
            dataView.refresh();
        }
    });


    //##### FAIL #####
    // this is where things seem to go wrong
    // The row item always provides data from the LAST grid populated!!
    // For example, if I have three grids, and I enter a filter term for
    // grids 1 or 2 or 3 the row item below always belongs to grid 3!!
    function filter(row) {
        var gridID = $(this).parents('.grid').attr('id');
        for (var columnId in grids.columnFilters[gridID]) {
            if (columnId !== undefined && columnFilters[columnId] !== "") {
                var header = grid.getColumns()[grid.getColumnIndex(columnId)];
                //console.log(header.name);
            }
        }
        return true;
    }


    grid.init();
    dataView.beginUpdate();
    dataView.setItems(data);
    dataView.setFilter(filter); // does it matter than I only have one dataView instance?
    dataView.endUpdate();
    grid.invalidate();
    grid.render();

总之，除了过滤函数之外，每个函数似乎都适当地绑定到每个网格。当我在任何网格中输入过滤条件时，它仅返回最后一个网格中的行。

我花了几个小时试图找出错误，但不得不承认失败。非常感激任何的帮助。

Answer 1

是的，重要的是你只有一个dataView实例。而且迟早你会发现所有网格的一个变量也是一个坏主意

所以在循环中添加var dataView，它应该解决问题

将功能分配给多个slickgrids

1 个答案: