1

我正在使用从 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() 方法。

4

1 回答 1

2

根据数据表文档 fnDraw 不会重新加载 Ajax 数据。但是，有一个名为 fnReloadAjax 的插件可以完全满足您的需求。以下代码是插件代码，只需将其保存为js文件并在加载datatables 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' );
于 2012-06-29T23:37:36.113 回答