Pager is not working with row span. After pagination scroll-er does't work.

[NiranjanBS]

Please let me know how to over come this issue. Let me know if I am doing anything wrong.

grid = new Slick.Grid("#cost_myGrid", dataView, columns, options);
grid.registerPlugin( new Slick.AutoTooltips({ enableForHeaderCells: true }) );
var cost_pager = new Slick.Controls.Pager(dataView, grid, $("#cost_pager"));
// var columnpicker = new Slick.Controls.ColumnPicker(columns, grid, options);

   // dataView.setPagingOptions({pageSize: data.length, pageSetting: false});

   // grid.setSelectionModel(new Slick.RowSelectionModel());
    // wire up model events to drive the grid
    dataView.onRowCountChanged.subscribe(function (e, args) {

      grid.updateRowCount();
      grid.render();
    });

    dataView.onRowsChanged.subscribe(function (e, args) {
        grid.invalidate();

// grid.invalidateRows(args.rows);
grid.render();
});

    grid.onAddNewRow.subscribe(function (e, args) {
        data.push(args.item);
        grid.invalidateRows([data.length]);
        grid.updateRowCount();
        grid.render();
      });

    grid.onMouseEnter.subscribe(function(e, args) {
        var cell = args.grid.getCellFromEvent(e);
        var item = dataView.getItem(cell.row);
        if(data[cell.row][grid.getColumns()[cell.cell].field])
        {
            if(cell.cell > 6)
            {

            }
        }
    });

    grid.onMouseLeave.subscribe(function(e, args) {
        $("#cost_tooltipdiv span").html("");
        $("#cost_tooltipdiv").hide();
    });

    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);
    });
    //grid.init();

    dataView.beginUpdate();
    dataView.setItems(data);
    dataView.endUpdate();

    $("#gridContainer").resizable();