具有固定列的子行（显示额外/详细信息）答案

【问题标题】：Child rows (show extra / detailed information) with fixed columns具有固定列的子行（显示额外/详细信息）
【发布时间】：2017-12-26 09:15:33
【问题描述】：

我使用Datatables插件https://datatables.net

如何使用左右固定列 https://datatables.net/extensions/fixedcolumns/examples/initialisation/left_right_columns.html 构建 row_details（子表）https://datatables.net/examples/api/row_details.html 像这样 datatableshttps://jsfiddle.net/bagratzakaryan/bu9o7btL/8/ 但在我的情况下，我使用服务器端并收到 datatables.js 错误 https://datatables.net/forums/discussion/46536/child-rows-show-extra-detailed-information-with-fixed-columns?new=1，见下

【问题讨论】：

标签： javascript jquery datatables

【解决方案1】：

我已经在datatables 论坛上发布了这个问题，并在其中回答了这个问题。

https://datatables.net/forums/discussion/46536/child-rows-show-extra-detailed-information-with-fixed-columns?new=1

https://datatables.net/download/compatibility

我已经像这段代码一样解决了这个任务。

var dataSet = [];  // like json
var columnDefs = [];  // init data in the columns

var table = $('#example').DataTable( {
    data: dataSet,
    columns: columnDefs,
    scrollX: true,
});

// datatable fixed columns
var fixedColumns = new $.fn.dataTable.FixedColumns(table, {
    leftColumns: 0,
    rightColumns: 1
});

event.open 细节控件

// unset fixed right column after epening additional details
fixedColumns.s.rightColumns = 0;
fixedColumns.s.iRightColumns = 0;
table.fixedColumns().update();

// hide fixed right column after epening additional details
$('.DTFC_RightWrapper').hide();

event.close 细节控件

// set fixed right column after closing additional details
fixedColumns.s.rightColumns = 1;
fixedColumns.s.iRightColumns = 1;
table.fixedColumns().update();

// show fixed right column after closing additional details
$('.DTFC_RightWrapper').show();

链接jsfiddle

【讨论】：