要自訂dataTable的處理中區塊

參考 https://datatables.net/reference/event/processing

 

$('#example')
    .on( 'processing.dt', function ( e, settings, processing ) {
        $('#processingIndicator').css( 'display', processing ? 'block' : 'none' );
    } )
    .dataTable();

 

1. 在dataTable呼叫前面加上.on( 'processing.dt', function ( e, settings, processing){}這個func

2. 在這個function中，把原本的processing的div隱藏起來，然後判斷processing這個參數是true, false，來顯示/隱藏自訂的處理中區塊

ex:

.on('processing.dt', function (e, settings, processing) {
    $('#processingIndicator').css('display', 'none');
    if (processing) {
        $(e.currentTarget).LoadingOverlay("show");
    } else {
        $(e.currentTarget).LoadingOverlay("hide", true);
    }
})

--

另外一種寫法是在oLanguage中加入sProcessing去自訂處理中區塊要顯示的內容，可以是字串，也可以是HTML。

這個寫法比較簡單，但如果要比較複雜的操作時，就要用上面那種方式。

"oLanguage": {
          "sProcessing": "loading data..."
   }

--

參考

https://datatables.net/forums/discussion/44240/custom-loading-mask-in-processing

https://stackoverflow.com/questions/13778011/showing-custom-message-in-jquery-datatable-while-loading-data

arrow
arrow
    全站熱搜

    dizzy03 發表在 痞客邦 留言(0) 人氣()

    E-mail轉寄