如何对数据表进行排序

How to sort datatable?

本文关键字：排序 数据表      更新时间：2023-09-26

我需要按"与剩余的联系人"列对下面的数据表进行排序，但仅适用于制动器之前的数字。

这是我的代码：

var oTable = $('#customers-list').dataTable({});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js"></script>
<table id="customers-list" class="table table-striped table-bordered table-hover">
  <thead>
    <tr>
      <th>Name</th>
      <th>Total
        <br>contacts</th>
      <th>Contacts with
        <br>the remaining</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Test1</td>
      <td class="text-center">11</td>
      <td class="text-center">7 (63.64%)</td>
    </tr>
    <tr>
      <td>Test2</td>
      <td class="text-center">25</td>
      <td class="text-center">14 (56%)</td>
    </tr>
    <tr>
      <td>Test3</td>
      <td class="text-center">24</td>
      <td class="text-center">24 (100%)</td>
    </tr>
    <tr>
      <td>Test4</td>
      <td class="text-center">24</td>
      <td class="text-center">3 (12.5%)</td>
    </tr>
    <tr>
      <td>Test5</td>
      <td class="text-center">24</td>
      <td class="text-center">20 (83.33%)</td>
    </tr>
    <tr>
      <td>Test6</td>
      <td class="text-center">24</td>
      <td class="text-center">24 (100%)</td>
    </tr>
    <tr>
      <td>Test7</td>
      <td class="text-center">24</td>
      <td class="text-center">22 (91.67%)</td>
    </tr>
    <tr>
      <td>Test8</td>
      <td class="text-center">24</td>
      <td class="text-center">22 (91.67%)</td>
    </tr>
    <tr>
      <td>Test9</td>
      <td class="text-center">24</td>
      <td class="text-center">24 (100%)</td>
    </tr>
    <tr>
      <td>Test10</td>
      <td class="text-center">24</td>
      <td class="text-center">24 (100%)</td>
    </tr>
    <tr>
      <td>Test11</td>
      <td class="text-center">24</td>
      <td class="text-center">24 (100%)</td>
    </tr>
    <tr>
      <td>Test12</td>
      <td class="text-center">0</td>
      <td class="text-center">0 (0%)</td>
    </tr>
    <tr>
      <td>Test13</td>
      <td class="text-center">24</td>
      <td class="text-center">24 (100%)</td>
    </tr>
  </tbody>
</table>

数据排序和数据排序可以做到这一点 

you can do like this
 <td class="text-center" data-order="14">14 (56%)</td>

了解更多

https://datatables.net/examples/advanced_init/html5-data-attributes.html

请参阅此数据表示例。

您需要在表初始化时添加排序特征。JSFiddle 

$('#example').DataTable( {
        "order": [[ 3, "desc" ]]
} );

我找到了解决方案：

var oTable = $('#customers-list').dataTable({
     {
         'sType': 'num-html',
         'aTargets': [2]
     }
 });
 $.extend($.fn.dataTableExt.oSort, {
     "num-html-pre": function(a) {
         var x = String(a).replace(/<['s'S]*?>/g, "");
         return parseFloat(x);
     },
     "num-html-asc": function(a, b) {
         return ((a < b) ? -1 : ((a > b) ? 1 : 0));
     },
     "num-html-desc": function(a, b) {
         return ((a < b) ? 1 : ((a > b) ? -1 : 0));
     }
 });
相关文章：