我正在使用jquery数据表的服务器端（serverside：true）实现。
另外，我的对象将表的状态保存到数据库中，以便一旦用户重新登录或清除了缓存，就可以恢复网格的最后状态。
用于生成数据表的代码：
function generateEquipmentDataTable() {
var businessType;
var printCounter = 0;
if ($(document).find('#euipmentSearch').hasClass('dataTable')) {
dtTable.destroy();
}
dtTable = $("#euipmentSearch").DataTable({
colReorder: {
fixedColumnsLeft: 2
},
rowGrouping: true,
searching: true,
serverSide: true,
"pagingType": "full_numbers",
"bProcessing": true,
"bDeferRender": true,
"order": [[1, "asc"]],
stateSave: true,
scrollX: true,
fixedColumns: {
leftColumns: 2,
},
language: {
url: "/base/GetDataTableLanguageJson?nGrid=" + true,
},
sDom: 'Btlipr',
buttons: [
'excelHtml5',
{
extend: 'print',
messageTop: function () {
printCounter++;
if (printCounter === 1) {
return 'This is the first time you have printed this document.';
}
else {
return 'You have printed this document ' + printCounter + ' times';
}
},
messageBottom: null
},
{
text: 'Export CSV',
extend: 'csv',
filename: 'Equipment List',
extension: '.csv'
},
{
text: 'Print',
extend: 'pdfHtml5',
exportOptions: {
columns: ':visible'
},
css: 'display:none',
title: 'Equipment List',
orientation: 'landscape',
pageSize: 'A3'
},
{
extend: 'colvis',
columns: ':not(.noVis)',
collectionLayout: 'fixed two-column',
//postfixButtons: ['colvisRestore'],
}
],
"orderMulti": true,
"ajax": {
"url": "/Equipment/GetequipmentGridData",
"type": "post",
"datatype": "json",
data: function (d) {
d.inactiveFlag = activeStatus;
d.srcData = LRTrim($("#txtEqpDataSrch").val());
d.ClientLookupId = LRTrim($("#EquipmentID").val());
d.Name = LRTrim($("#Name").val());
d.Location = LRTrim($("#Location").val());
d.SerialNumber = LRTrim($("#SerialNumber").val());
d.Type = LRTrim($('#ddlType').val());
d.Make = LRTrim($("#Make").val());;
d.Model = LRTrim($("#ModelNumber").val());;
d.LaborAccountClientLookupId = LRTrim($("#AccountSearch").val());
d.AssetNumber = LRTrim($("#AssetsNumber").val());
d.Area_Desc = LRTrim($("#Area").val());
d.Line_Desc = LRTrim($("#Line").val());
d.Dept_Desc = LRTrim($("#Department").val());
},
"dataSrc": function (result) {
searchcount = result.recordsTotal;
if (result.data && result.data.length) {
businessType = result.data[0].BusinessType;
}
$.each(result.data, function (index, item) {
searchresult.push(item.EquipmentId);
});
if (totalcount < result.recordsTotal)
totalcount = result.recordsTotal;
if (totalcount != result.recordsTotal)
selectedcount = result.recordsTotal;
//#region type-drop-down
$("#ddlType").empty();
$("#ddlType").append("<option value=''>" + "--Select--" + "</option>");
for (var i = 0; i < result.typeList.length; i++) {
var id = result.typeList[i];
var name = result.typeList[i];
$("#ddlType").append("<option value='" + id + "'>" + name + "</option>");
}
if (typeValEquipment) {
$("#ddlType").val(typeValEquipment);
}
//#endregion
HidebtnLoader("btnsortmenu");
return result.data;
}
},
select: {
style: 'os',
selector: 'td:first-child'
},
"columns":
[
{
"data": "EquipmentId",
orderable: false,
"bSortable": false,
className: 'select-checkbox dt-body-center',
"name": "1",
'render': function (data, type, full, meta) {
if ($('#eqsearch-select-all').is(':checked') && totalcount == selectedcount) {
return '<input type="checkbox" checked="checked" name="id[]" data-eqid="' + data + '" class="chksearch ' + data + '" value="'
+ $('<div/>').text(data).html() + '">';
} else {
if (equiToupdate.indexOf(data) != -1) {
return '<input type="checkbox" checked="checked" name="id[]" data-eqid="' + data + '" class="chksearch ' + data + '" value="'
+ $('<div/>').text(data).html() + '">';
}
else {
return '<input type="checkbox" name="id[]" data-eqid="' + data + '" class="chksearch ' + data + '" value="'
+ $('<div/>').text(data).html() + '">';
}
}
}
},
{
"data": "ClientLookupId",
"autoWidth": false,
"bSearchable": true,
"bSortable": true,
className: 'text-left',
"mRender": function (data, type, row) {
return '<a class=link_equi_detail href="javascript:void(0)">' + data + '</a>'
}
},
{ "data": "Name", "autoWidth": true, "bSearchable": true, "bSortable": true, "name": "2" },
{ "data": "Location", "autoWidth": true, "bSearchable": true, "bSortable": true, "name": "3" },
{ "data": "SerialNumber", "autoWidth": true, "bSearchable": true, "bSortable": false },
{ "data": "Type", "autoWidth": true, "bSearchable": true, "bSortable": true, "name": "5" },
{ "data": "Make", "autoWidth": true, "bSearchable": true, "bSortable": false },
{ "data": "Model", "autoWidth": true, "bSearchable": true, "bSortable": false },
{ "data": "LaborAccountClientLookupId", "autoWidth": true, "bSearchable": true, "bSortable": false },
{ "data": "AssetNumber", "autoWidth": true, "bSearchable": true, "bSortable": false },
{ "data": "Area_Desc", "autoWidth": true, "bSearchable": true, "bSortable": false },
{ "data": "Line_Desc", "autoWidth": true, "bSearchable": true, "bSortable": false },
{ "data": "Dept_Desc", "autoWidth": true, "bSearchable": true, "bSortable": false }
]
,
columnDefs: [
{
targets: [0, 1],
className: 'noVis'
},
{
targets: -1,
visible: false
}
],
"stateSaveCallback": function (settings, data) {
debugger;
// Send an Ajax request to the server with the state object
$.ajax({
"url": "/Base/CreateUpdateState",
"data": {
GridName: "Equipment_Search",
LayOutInfo: JSON.stringify(data)
},
"dataType": "json",
"type": "POST",
"success": function () { }
});
},
"stateLoadCallback": function (settings, callback) {
var o;
$.ajax({
"url": "/Base/GetState",
"data": {
GridName: "Equipment_Search",
},
"async": false,
"dataType": "json",
"success": function (json) {
callback(json);
//o = json;
}
});
//return o;
},
initComplete: function () {
SetPageLengthMenu();
if (totalcount != 0 && (totalcount == equiToupdate.length || (searchcount != totalcount && arrayContainsArray(equiToupdate, searchresult) == true))) {
$('#eqsearch-select-all').prop('checked', true);
} else {
$('#eqsearch-select-all').prop('checked', false);
}
var currestsortedcolumn = $('#euipmentSearch').dataTable().fnSettings().aaSorting[0][0];
var column = this.api().column(currestsortedcolumn);
var columnId = $(column.header()).attr('id');
switch (columnId) {
case "thEquipId":
EnableEquipIdColumnSorting();
break;
case "thName":
EnableNameColumnSorting();
break;
case "thLocation":
EnableLocationColumnSorting();
break;
case "thType":
EnableTypeColumnSorting();
break;
}
$('#btnsortmenu').text(getResourceValue("spnSorting") + " : " + column.header().innerHTML);
}
});
}
我能够将状态保存在数据库中，并在加载网格后将其提取。
问题：
在第一次加载statesavecallback函数时，它会被调用两次，并重置状态。
generateEquipmentDataTable在document.ready内部被调用一次