javascript - 自定义数据表中的渲染

Question

DataTables 插件似乎不允许自定义渲染。

我们可以使用 aTargets 和 mRender 在初始化时自定义单元格渲染:

"aoColumnDefs": [{
    "aTargets": [transaction_id_index],
"mRender": function (data, type, row) {
    return 'custom '+data;
    }
}]

我怎样才能对表格标题做同样的事情？

注意:我使用了显示和隐藏功能，所以我不能直接修改 aoColumns 中的 sTitle。

编辑

我想重命名列标题以最小化列宽。我得到了这样的 sTitle:“foo_bar”。现在我正在使用它，但这肯定不是最好的方法:

'fnInitComplete': function(oSettings, json){
    $(table).find("thead tr th").each(function(index) {
        $(this).html($(this).html().split("_").join("<br>"));
    });
},
"fnDrawCallback": function( oSettings ) {
    // TO IMPROVE
    $(table).find("thead tr th").each(function() {
        if($(this).text().indexOf("_") !== -1) {
            $(this).html($(this).text().split("_").join("<br>"));                                        
        }
    });
}

感谢@kabstergo 的提示!我没有关闭这个问题，因为我的解决方案不“干净”。

Answer 1

是的，您可以自定义页眉和页脚，因为没有人回答您会尝试给您一个开始。注意:我不是数据表内部工作方式方面的专家。

在我们的网站上，我们有带有自定义标题的数据表。这是通过这样做来实现的

var table = $('#my-datatable');
table.dataTable({
  ...
  'sDom': '<"dataTables_header"lfr>t<"dataTables_footer"ip>',
  'fnInitComplete': function(oSettings){
    // Style length select
    table.closest('.dataTables_wrapper').find('.dataTables_length select').addClass('select blue-gradient glossy').styleSelect();
    tableStyled = true;
  }
});

就像我说的，我希望它能帮助你开始一些事情......