如何在 DataTable 中显示加载/处理消息？

Question

在我的应用程序中，我使用的是datatables.net

var ticketHistoryDataTable = $('#ticketHistoryData').DataTable({ 
        paging: false,
        data: [],
        searching: false,
        columns: [
            { data: 'ticket_id'         ,   title: "Ticket Number" },
            { data: 'transactiondate'   ,   title: "Date"          } 
        ]
} );

我通过以下方式向表中添加数据：

    var result_data = [{
            ticket_id         : '' ,
            transactiondate   : '' 
    },{
            ticket_id         : '' ,
            transactiondate   : '' 
    }];

    ticketHistoryDataTable.clear().draw();
    ticketHistoryDataTable.rows.add(result_data).draw();

result_data 本身来自 jquery ajax get 调用服务器。检索信息可能需要一些时间，在此期间我想显示来自数据表的加载处理消息。这样做的正确方法是什么？

Answer 1

您可以在 html 中使用加载器。位置应与桌子相同。如何在 HTML 中添加加载器

或消息容器：<div id="MessageContainer"></div> 并应用一些 CSS 样式以获得良好的外观。

     $('#ticketHistoryData')
        .on( 'draw.dt', function () {
            console.log( 'Loading' );
          //Here show the loader.
          // $("#MessageContainer").html("Your Message while loading");
        } )
        .on( 'init.dt', function () {
            console.log( 'Loaded' );
           //Here hide the loader.
            // $("#MessageContainer").html("Your Message while load Complete");
        } )
        .DataTable({ 
            paging: false,
            data: [],
            searching: false,
            columns: [
                { data: 'ticket_id'         ,   title: "Ticket Number" },
                { data: 'transactiondate'   ,   title: "Date"          } 
            ]
     });

有关更多信息，请查看 DataTable 的事件

我想这可能对你有帮助。

您可能会显示消息