Назначение функций нескольким slickgrids

Question

Пожалуйста, помогите решить эту очень неприятную проблему. Я использую цикл for для итерации по массиву данных и создания нескольких гридов. Она работает хорошо, но функция фильтра не является обязательной образом (он связывается только с ПОСЛЕДНЕЙ сеткой, созданной) Вот код:

// 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 в свой цикл, он должен решить проблему