我有一个弹出窗口,其中显示了一个 DataTable:
<div data-role="popup" id="infoParticelleDesktop" class="popupTopLeft" data-theme="a" data-overlay-theme="a">
<table id="tableParticelleE" class="row_border" cellspacing="0">
<thead>
<tr>
<th></th>
<th>Sub</th>
<th>PM</th>
...
</tr>
</thead>
<tbody></tbody>
</table>
</div>
var oTable = $(tableId).dataTable({
"fixedHeader": true,
"bFilter": true,
"bInfo": false,
"bDestroy": true,
"aaData": dataTablePa,
"bPaginate": false,
"bSort": false,
"bAutoWidth": false,
"aoColumns": colPa,
"dom": 'Zlfrtip',
"fnRowCallback": function (nRow, aData) {
var $nRow = $(nRow);
$nRow.css({ "background-color": "#FFbd4f", "text-shadow": "none" });
return nRow;
}
});
oTable.fixedHeader.enable(true);
在此表中,我还有一个按钮,当单击另一个表时,会出现在第一个表下方:
$(tableId + ' tbody td img').on('click', function () {
var nTr = $(this).parents('tr')[0];
var nTds = this;
if (oTable.fnIsOpen(nTr)) {
this.src = "Images/plus.png";
oTable.fnClose(nTr);
}
else {
var rowIndex = oTable.fnGetPosition($(nTds).closest('tr')[0]);
var detailsRowData = dataTablePa[rowIndex].proprietari;
this.src = "Images/minus.png";
oTable.fnOpen(nTr, fnFormatDetails(iTableCounter, tableProprietari), 'proprietari');
oInnerTable = $("#tableParticelle_" + iTableCounter).dataTable({
"bFilter": false,
"aaData": detailsRowData,
"bSort": false,
"bInfo": false,
"bPaginate": false,
"bAutoWidth": false,
"aoColumns": colPr
});
iTableCounter = iTableCounter + 1;
}
});
该表可以有很多行并且可以很长。我有一个弹出窗口的最大高度和一个垂直滚动条。我希望主表的标题固定在顶部。因此,在此之后我添加了fixedHeader,但没有任何变化。