Question

我正在其中一张表上使用jQuery Datatables，以便于过滤，搜索和排序。但是，我想根据姓氏在页面加载时对行进行排序。棘手的部分是，包含姓氏的单元格包含全名。

HTML

<table id="Test-Table" class="table table-bordered table-hover">
  <thead>
    <tr>
      <th>Name</th>
      <th>Age</th>
    </tr>
  </thead>

  <tbody>
    <tr>
      <td>John Doe</td>
      <td>20</td>
    </tr>
    <tr>
      <td>Jane Doe</td>
      <td>29</td>
    </tr>
    <tr>
      <td>Greg Maddux</td>
      <td>51</td>
    </tr>
    <tr>
      <td>David Goggins</td>
      <td>45</td>
    </tr>
    <tr>
      <td>Walter Bond</td>
      <td>60</td>
    </tr>
  </tbody>
</table>

jQuery

$(document).ready(function(){
    $("#Test-Table").DataTable();
});

这是我的Fiddle。

我假设我会以某种方式拆分名称，然后按姓氏排序，如果两个人的姓氏相同，则按名字排序？

在实现此目标方面的任何帮助将不胜感激。

Answer 1

您可以使用data-order/data-sort属性...

$(document).ready(function(){
    $("#Test-Table").DataTable();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/v/dt/dt-1.10.18/datatables.min.js"></script>
<link href="https://cdn.datatables.net/v/dt/dt-1.10.18/datatables.min.css" rel="stylesheet"/>
<table id="Test-Table" class="table table-bordered table-hover">
  <thead>
    <tr>
      <th>Name</th>
      <th>Age</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td data-order="Doe John">John Doe</td>
      <td>20</td>
    </tr>
    <tr>
      <td data-order="Doe Jane">Jane Doe</td>
      <td>29</td>
    </tr>
    <tr>
      <td data-order="Maddux Greg">Greg Maddux</td>
      <td>51</td>
    </tr>
    <tr>
      <td data-order="Goggins David">David Goggins</td>
      <td>45</td>
    </tr>
    <tr>
      <td data-order="Bond Walter">Walter Bond</td>
      <td>60</td>
    </tr>
  </tbody>
</table>

如何按单元格值的子字符串排序？

1 个答案: