在过去的两个星期中,我一直试图在他们的论坛上发帖,但我的发帖或主题从未显示。
我先从服务器端将表创建为HTML,然后再将其转换为DataTable。总数是在服务器端进行处理的(因为它不像将它们全部加起来那样简单,而是存在平均值和各种排序)。 Here's the original table.如您所见,“总计”行在表中的排列方式与其他任何行一样。
我尝试将总行放在页脚中,但这导致水平滚动条位于数据和总行之间。 See this example。这是因为水平滚动条已应用于tbody表。由于FixedColumns的工作原理,页脚是其自己的表的一部分...我试图通过在DataTables构造函数中禁用水平滚动条并将其包装在固定宽度的div中来手动重新创建效果。它起作用了,但是FixedColumns没有t,因为它需要设置滚动宽度...
我曾尝试在DataTable的绘制回调期间使用jQuery重组表,但是FixedColumns使得HTML变得一团糟,我无法做到这一点(大约有4个表,全部包含div,全部带有隐藏/剥离的仅用于一张桌子的页眉/正文/页脚)。我不会发布代码,因为它不起作用,但是涉及到用一个类标记该行,找到该行,将其克隆,删除原始行,然后将克隆的行附加到tbody的底部。即使这行得通,也会因为将奇数/偶数行移动到彼此相邻而破坏格式= /
我试图编写自己的排序函数以始终将Total放在底部,但是它仅在按名称排序时才起作用(因为这是我唯一一次访问“ total”一词,因为它仅具有该列的数据)。
我觉得这是完全错误的,因为肯定有人在服务器端需要总行才行...我可以找到的所有示例都没有使用FixedColumn。
最佳答案
我已经通过使用一个相当笨拙的jQuery修复了这个问题。首先,在页脚中绘制Total行,然后将其添加为FrozenColumns构造函数的fnDrawCallback
。其中#datatable_wrapper
与表的ID匹配。
var totalLabel= jQuery("#datatable_wrapper .DTFC_ScrollWrapper .DTFC_LeftWrapper .DTFC_LeftFootWrapper table tfoot").clone();
jQuery("#datatable_wrapper .DTFC_ScrollWrapper .DTFC_LeftWrapper .DTFC_LeftFootWrapper table tfoot").hide();
jQuery("#datatable_wrapper .DTFC_ScrollWrapper .DTFC_LeftWrapper .DTFC_LeftBodyWrapper table tbody").append(jQuery(totalLabel).html());
var totalData = jQuery("#datatable_wrapper .DTFC_ScrollWrapper .dataTables_scroll .dataTables_scrollFoot .dataTables_scrollFootInner table tfoot").clone();
jQuery("#datatable_wrapper .DTFC_ScrollWrapper .dataTables_scroll .dataTables_scrollFoot .dataTables_scrollFootInner table tfoot").hide();
jQuery("#datatable_wrapper .DTFC_ScrollWrapper .dataTables_scroll .dataTables_scrollBody table tbody").append(jQuery(totalData).html());
A working example can be found here.
关于jquery - 努力将总行放置在DataTables表的底部,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/18354148/