DataTables加载消息未显示

时间:2014-07-17 18:41:38

标签: datatables jquery-datatables

我对此事的其他答案没有运气,所以我在这里。我用一些MySQL数据填充表格,在数据准备好显示之前它永远不会被绘制,并且由于数据花费时间我喜欢弹出消息。这是完整的代码。

function getData(startDate, endDate) {  
    $.ajax({
        url: "/getData",
        type: 'post',   
        contentType: "application/json",
        processData: false,         
        dataType: "json",       
        data : JSON.stringify({ startDate : startDate, endDate : endDate }),            
        complete: function(data){               
            $("#offline").dataTable({                                           
                "aaData": data.responseJSON[0],                     
                "bProcessing": true,                        
                "aoColumns": [                              
                    { "sWidth": "25%","sTitle": "Myfield1", "mDataProp": "field1"},
                    { "sWidth": "25%","sTitle": "Myfield2", "mDataProp": "field2"},
                    { "sWidth": "25%","sTitle": "Myfield3", "mDataProp": "field3"},
                    { "sWidth": "25%","sTitle": "Myfield4", "mDataProp": "field4",
                        "mRender": function ( data, type, full ) {                                               
                                    return data + ' %';
                                } 
                            }
                ],              
                "oLanguage": {
                    "sUrl": "/javascripts/i18n/dataTables.modified.json"
                },                  
                "aaSorting": [[ 0, "desc" ]],
                "bSort": false,
                "bInfo" : false,                                
                "bPaginate": false,
                "bFilter": false
            });
        }
    });
}

对于我已阅读的内容,我需要将bProcessing设置为true并对sDom参数执行某些操作,但我无法使其正常工作。

感谢。

2 个答案:

答案 0 :(得分:2)

还有一点需要注意......你必须包括dom代码" r"到datatables创建脚本...

dom: "r",
processing: true,

https://datatables.net/examples/basic_init/dom.html

答案 1 :(得分:1)

我认为处理消息没有显示,因为当您初始化数据表时(在ajax'完成'回调中),数据已经加载,因此不需要显示处理消息。如果先启动数据表并使用sAjaxSource加载数据,它将按预期工作:

var oTable = $("#offline").dataTable({                                           
    'bServerSide': true,
    'fnServerParams': function (aoData) {
       aoData.push({ "name": "startDate", "value": $('#startDate').val() });
       aoData.push({ "name": "endDate", "value": $('#endDate').val() });
     },
     'sAjaxSource': "/getData",
    'bProcessing': true,                     
    "aoColumns": [                              
        { "sWidth": "25%","sTitle": "Myfield1", "mDataProp": "field1"},
        { "sWidth": "25%","sTitle": "Myfield2", "mDataProp": "field2"},
        { "sWidth": "25%","sTitle": "Myfield3", "mDataProp": "field3"},
        { "sWidth": "25%","sTitle": "Myfield4", "mDataProp": "field4",
            "mRender": function ( data, type, full ) {                                               
                        return data + ' %';
                    } 
                }
    ],              
    "oLanguage": {
        "sUrl": "/javascripts/i18n/dataTables.modified.json"
    },                  
    "aaSorting": [[ 0, "desc" ]],
    "bSort": false,
    "bInfo" : false,                                
    "bPaginate": false,
    "bFilter": false
});

请注意,我已经通过你的开始&使用fnServerParams结束日期参数,但您也可以将它们添加到网址的末尾:/getData?startDate= ...