如何对数据表进行排序?

时间:2016-01-21 09:06:35

标签: javascript jquery html datatable

我需要通过"与其余"的联系人对以下数据表进行排序。列,但仅适用于支架之前的数字。

这是我的代码:



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>
&#13;
&#13;
&#13;

3 个答案:

答案 0 :(得分:3)

数据顺序数据排序可以执行此操作

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

答案 1 :(得分:0)

请参阅此DataTable Example

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

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

答案 2 :(得分:0)

我找到了解决方案:

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));
     }
 });