jQuery dataTable排序與ajax加載的數據

Question

我有幾行包含一些延遲加載的數據。 例如，

  <table border="1"> <tr> <th>Employee</th><th>Sales</th> </tr> <tr> <td>Michale</td><td>1000</td> </tr> <tr> <td>Kim</td><td id="kimSales"></td> </tr> <tr> <td>John</td><td id="johnSales"></td> </tr> </table> 

問題是，由於某些原因， 我必須在頁面加載后檢索一些數據 。 假設kimSales為1500 ，johnSales為2500 。

<script>
    $(document).on('ready', function(e){
         $('#kimSales').text(1500);
         $('#johnSales').text(2500);
    })     
</script>

在這種情況下，我想對延遲加載的數據進行正確排序。 您知道，jQuery dataTable通過列的單擊標題具有排序功能，例如https://datatables.net，我無法正確地對這些數據進行排序。 排序后的數據沒有上升，或者是dsc ---也許dataTable在加載數據后無法識別。

我試過了

<script>
    $(document).on('ready', function(e){
         $('#kimSales').text(1500);
         $('#johnSales').text(2500);
    })

    table.dataTable(); // not properly working
</script>

Answer 1

如果在初始化表之前更新單元格的數據，它應該可以正常工作。

另外，您應該在ready事件處理程序中初始化表。 例如：

$(document).on('ready', function(e){
     $('#kimSales').text(1500);
     $('#johnSales').text(2500);

     var table = $('#example').DataTable();
});

如果在初始化表后更新單元格的數據，則需要使用cell().invalidate() API方法並重繪表。

例如：

$(document).on('ready', function(e){
     var table = $('#example').DataTable();

     $('#kimSales').text(1500);
     table.cell($('#kimSales').closest('td')).invalidate();

     $('#johnSales').text(2500);
     table.cell($('#johnSales').closest('td')).invalidate();

     table.draw();
});

Answer 2

我希望您希望根據第二列進行排序。 在表初始化代碼中，並使用首選的排序技術[asc，desc]嘗​​試此操作

 $('table').DataTable( {
        "order": [[ 1, "desc" ]]
    } );