我正在使用从json文件中获取数据的数据表。
var date=new Date();
var day=date.getDate();
var dataTable = $('#.main_content table').dataTable({
"bProcessing": true,
"bPaginate": false,
"bSort": false,
"bServerSide": true,
"bjQueryUI": true,
"sAjaxSource": 'sources/data.json',
"fnServerData": fnServerObjectToArray()
});
正如您所看到的,我正在使用一个函数从json文件中提取数据。
fnServerObjectToArray = function () {
return function (sSource, aoData, fnCallback) {
$.ajax({
"dataType": 'json',
"type": "GET",
"url": sSource,
"data": aoData,
"dataType": "json",
"success": function (json) {
var a = [];
var data = json.aoData;
for (var i = 0, iLen = data.appointments.length; i < iLen; i++) {
var inner = [];
inner.push(data.appointments[i].time);
if (data.appointments[i].CHT111[day]) {
inner.push(data.appointments[i].CHT111[day]);
inner.push(data.appointments[i].DOB[day]);
inner.push(data.appointments[i].Patient[day]);
inner.push(data.appointments[i].Visit_Reason[day]);
inner.push(data.appointments[i].Room[day]);
inner.push(data.appointments[i].Scheduled[day]);
}
else {
inner.push(data.appointments[i].CHT111.default);
inner.push(data.appointments[i].DOB.default);
inner.push(data.appointments[i].Patient.default);
inner.push(data.appointments[i].Visit_Reason.default);
inner.push(data.appointments[i].Room.default);
inner.push(data.appointments[i].Scheduled.default);
}
a.push(inner);
}
json.aaData = a;
fnCallback(json);
}
});
}
}
问题是我有一个更改day变量的按钮,然后调用fnDraw()方法,该方法不起作用。
答案 0 :(得分:2)
根据datatables文档,fnDraw不会重新加载Ajax数据。但是,有一个名为fnReloadAjax的插件可以完全满足您的要求。下面的代码是插件代码,只需将其保存为js文件并在加载数据表js后加载它,但在初始化表之前:
$.fn.dataTableExt.oApi.fnReloadAjax = function ( oSettings, sNewSource, fnCallback, bStandingRedraw )
{
if ( typeof sNewSource != 'undefined' && sNewSource != null )
{
oSettings.sAjaxSource = sNewSource;
}
this.oApi._fnProcessingDisplay( oSettings, true );
var that = this;
var iStart = oSettings._iDisplayStart;
var aData = [];
this.oApi._fnServerParams( oSettings, aData );
oSettings.fnServerData( oSettings.sAjaxSource, aData, function(json) {
/* Clear the old information from the table */
that.oApi._fnClearTable( oSettings );
/* Got the data - add it to the table */
var aData = (oSettings.sAjaxDataProp !== "") ?
that.oApi._fnGetObjectDataFn( oSettings.sAjaxDataProp )( json ) : json;
for ( var i=0 ; i<aData.length ; i++ )
{
that.oApi._fnAddData( oSettings, aData[i] );
}
oSettings.aiDisplay = oSettings.aiDisplayMaster.slice();
that.fnDraw();
if ( typeof bStandingRedraw != 'undefined' && bStandingRedraw === true )
{
oSettings._iDisplayStart = iStart;
that.fnDraw( false );
}
that.oApi._fnProcessingDisplay( oSettings, false );
/* Callback user function - for event handlers etc */
if ( typeof fnCallback == 'function' && fnCallback != null )
{
fnCallback( oSettings );
}
}, oSettings );
};
现在,只要您想使用新的过滤数据重新加载表,就可以调用以下代码:
dataTable.fnReloadAjax( 'sources/data.json' );