1

この非常に厄介な問題を解決するのを手伝ってください。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();

要約すると、各関数はフィルター関数を除いて各グリッドに適切にバインドされているようです。任意のグリッドにフィルター条件を入力すると、最後のグリッドの行のみが返されます。

欠点を見つけようと数時間を費やしましたが、敗北を認めざるを得ません。どんな助けでも大歓迎です。

4

1 に答える 1

0

はい、dataView のインスタンスが 1 つだけであることが重要です。また、遅かれ早かれ、すべてのグリッドに対して 1 つの変数を使用することも悪い考えであるという事実に気付くでしょう。

ループにaを追加するvar dataViewと、問題が解決するはずです

于 2015-04-10T17:44:19.233 に答える