slickgrid 格式化程序和虚拟滚动重置表单答案

【问题标题】：slickgrid formatter and virtual scrolling resetting formslickgrid 格式化程序和虚拟滚动重置表单
【发布时间】：2013-06-04 08:07:09
【问题描述】：

function linkFormatter(row, cell, value, columnDef, dataContext) {
    var cell = "";
    cell += '<input type="checkbox" id="cb' + dataContext['id'] + '" name="cb' + dataContext['id'] + '" value="' + dataContext['id'] + '" ' + (dataContext['Reviewer'] == 'Unassigned' ? 'class="unassignedLoan"' : "") + '> ';
    cell += '<a href="LoanEdit.aspx?loanid=' + dataContext['id'] + '">' + value + '</a>';
    return cell;
};

我有这个带有dataView 的格式化函数。当用户将该行滚动到视图之外并单击不同的单元格时，格式化程序创建的checkbox 将被重置。我认为虚拟滚动正在使用格式化程序重新渲染该单元格，因此它会丢失checkbox 的值。有没有人建议解决这个问题？

谢谢

【问题讨论】：

标签： slickgrid formatter

【解决方案1】：

在滚动或排序时，网格 DOM 会再次创建。所以初始值被重置。您必须将值（例如选中的复选框的 id）保存在一个数组中，并在滚动和排序事件中再次设置它。

这样做...

grid.onScroll.subscribe(function(e) {
            grid.invalidate();
            grid.render();

            var $canvas = $(grid.getCanvasNode()), $allRows = $canvas
                    .find('.slick-row');

            $($allRows).each(function() {
                if(this row's checkbox is in selectedRowId){
                                       set checkbox property to checked;
                                     }
            });

        });
grid.onSort.subscribe(function(e) {
            grid.invalidate();
            grid.render();

            var $canvas = $(grid.getCanvasNode()), $allRows = $canvas
                    .find('.slick-row');

            $($allRows).each(function() {
                if(this row's checkbox is in selectedRowId){
                                       set checkbox property to checked;
                                     }
            });

        });

【讨论】：