我想制作延迟初始化dataTable,在点击页码时加载数据。
我这样做就是根据请求加载数据,但是表格在开头呈现空表格,当点击任何其他数字时,所有页码都会显示超过10条记录,并且此标题显示为“Show 41 to Nan”来自NaN(从NaN总条目中过滤)“点击页码,当然数字41根据点击的页码更改。
$.ajax({
type:'POST',
//get total record within db
url: url+'getTotalInst',
success: function(total){
var oTable = $('#institutionsTable').dataTable( {
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"bProcessing": true,
"bAutoWidth": false,
"sAjaxSource": "control_panel/Institution_controller/getAllInstituions",
"aoColumns": [
{
"mData": "institution_name"
},
{
"mData": "institution_type"
},
{
"mData": "address"
} ,
{
"sTitle": "Tasks",
"sDefaultContent":"", // must be used to prevent "Requested unknown parameter" error
"fnRender": function(obj) {
var inst_id = obj.aData.inst_id;
var returnButton = '<span class="button-group">'+
'<a href=<?php echo base_url() ?>index.php/updateInst/'+inst_id+' class="optionButton icon edit">edit</a>'+
'<a href="#" class="optionButton icon remove danger">delete</a>'+
'</span>';
return returnButton;
}
}],
"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
$(nRow).attr("id",aData.inst_id);
return nRow;
},
//for defer rendering! but not work well
"bDeferRender": true,
"bServerSide": true,
"iDeferLoading": total,
"iDisplayLength" : 10
} );
}
});
修改
Json回归很大,但这里有样本
{"aaData":[{inst_id:79, institution_type:مراكز صحية, institution_name:مستشفى الشهيد كمال عدوان,…},…],"iTotalRecords":71,"iTotalDisplayRecords":10}