我正在角度项目中使用DataTable。当我将fixedColumns与serverSide处理一起使用时,将显示fixedColumns(重叠的列),但是没有数据。
当我在具有5000ms时间间隔的setTimeout函数中使用table.fixedColumns()。update()时,空行仍然显示,但没有数据。
空行数与原始列的行数匹配。
为什么数据不能像原始列那样显示在fixedColumns(重叠列)中?
下面是我的代码示例:
var table = $('#contactusdt').DataTable({
pagingType: 'full_numbers',
pageLength: 10,
lengthMenu: [10, 25, 100],
serverSide: true,
processing: true,
responsive: true,
searching: false,
language: {
"search": '<i class="fa fa-search search-eye"></i>',
searchPlaceholder: 'Name / Email',
processing: '<span ><img src="assets/img/busy.gif" alt="Loading.."></span> ',
paginate: {
first: '«',
last: '»',
next: '›',
previous: '‹'
}
},
drawCallback: function (oSettings) {
this.show();
var pgr = $(oSettings.nTableWrapper).find('.dataTables_paginate')
if (oSettings._iDisplayLength > oSettings.fnRecordsDisplay()) {
pgr.hide();
} else {
pgr.show()
}
},
"order": [[ 0, "desc" ]],
"sDom": '<lfBptipr >',
ajax: (dataTablesParameters: any, callback) => {
var postPrams = this.getPostParameters("clsPostParam");
var date_from = this.getPostParameters("clsPostParam1");
var date_to = this.getPostParameters("clsPostParam2");
var custom_search = $('#search').val();
dataTablesParameters.url = 'services_get_contact_details';
dataTablesParameters.method = 'POST';
dataTablesParameters.auth = localStorage.getItem('authkey');
dataTablesParameters.data = {
"condFilter": postPrams,
"date_from": date_from,
"date_to": date_to,
"custom_search": custom_search
};
let jsondata = 'jsondata=' + JSON.stringify(dataTablesParameters);
that.http
.post<DataTablesResponse>(
global.baseUrl,
jsondata, { headers: headers }
).subscribe(resp => {
if (resp) {
this.contactDetails$ = resp['data'];
$('.content-wrapper').removeClass('overlay');
}
callback({
recordsTotal: resp.recordsTotal,
recordsFiltered: resp.recordsFiltered,
data: []
});
});
},
"columnDefs": [{
"targets": 0,
"orderable": false
}, {
"targets": 2,
"orderable": false
}, {
"targets": 4,
"orderable": false
},
{
"targets": 5,
"orderable": false
},
{
"targets": 8,
"orderable": false,
"width": "20%"
},
{
"targets": 9,
"orderable": false
}
],
buttons: {
dom: {
button: {
tag: 'button',
className: ''
}
},
buttons: [
{
text: '<i class="fa fa-repeat"></i>',
action: function () {
$('#leadsource').val(null).trigger('change.select2');
$('#leadstatus').val(null).trigger('change.select2');
$('#c_start_date').val('');
$('#c_end_date').val('');
$('#search').val('');
that.reload();
},
className: ' btn btn-xs resetbtn'
},
]
},
scrollX: true,
scrollCollapse: true,
paging: true,
"initComplete": function (settings, json) {
var table = $('#contactusdt').dataTable().api();
var fixedColumns = new $.fn.dataTable.FixedColumns( table, {
leftColumns: 2,
rightColumns: 2,
heightMatch: 'none'
} );
//table.fixedColumns().update();
}
});
setTimeout( function() {
var table = $('#contactusdt').DataTable();
table.fixedColumns().update();
}, 5000);
我的控制台没有看到任何错误。