Question

我正在使用jQuery DataTables插件，并希望为单元格提供自定义渲染器。但是，如果选中表中的行，我希望单元格显示不同。

这是我到目前为止的代码：

render: function (data, type, full, meta) {
    var rowIdx = meta.row;
    var rowSelected = ???;  // How do I determine this?
    if (rowSelected) {
        return "<i class='foo'></i>";
    }
    return "<i class='bar'></i>";
}

我不知道如何从渲染器内部查询表本身，以测试是否选择了行（由meta.row给出）。有人可以帮忙吗？

Answer 1

<强>解

如果您使用Select扩展程序，则所选行将包含课程selected。

使用以下代码在选择行时动态呈现单元格内容。

您还需要处理select和deselect事件，以便在选择或取消选择行后重绘该行。

var table = $('#example').DataTable({
   select: true,
   columnDefs: [
      {
         targets: 0,
         render: function(data, type, full, meta){
            var api = new $.fn.dataTable.Api(meta.settings);
            if(type === 'display'){
               if($(api.row(meta.row).node()).hasClass('selected')){
                  data = data + ' (selected)';
               }
            }
            return data;
         }
      }
   ]
});

// Handle row selection event
$('#example').on('select.dt deselect.dt', function(e, api, type, items) {
   api.rows(items).invalidate('data').draw(false);
});

<强>样本

请参阅this jsFiddle以获取代码和演示。

如果选择了行，如何以不同方式渲染单元格？

1 个答案: