HTML 表格排序

Question

所以基本上我正在運行一個 mysql 查詢，該查詢從我的資料庫中獲取資料並以易於用戶閱讀的佈局顯示它。

Name-----Address----Sales Person

你明白要點了。現在我想讓用戶按銷售人員對 html 表進行排序。我如何使用下拉式選單輕鬆做到這一點？

<code><div class='menu'>
  <ul>
    <li><a href='#'><span>Sales Person</span></a>
      <ul>
        <li><a href='#'><span>Melissa</span></a></li>
        <li><a href='#'><span>Justin</span></a></li>
        <li><a href='#'><span>Judy</span></a></li>
        <li><a href='#'><span>Skipper</span></a></li>
        <li><a href='#'><span>Alex</span></a></li>
      </ul>
    </li>
  </ul>
</div></code>

Answer 1

這是另一個函式庫。

需要進行的更改是 -

1. #新增排序js
   

2. #將類別名稱sortable加入到表格中。

點選表格標題對表格進行對應排序：

<script src="https://www.kryogenix.org/code/browser/sorttable/sorttable.js"></script>

<table class="sortable">
  <tr>
    <th>Name</th>
    <th>Address</th>
    <th>Sales Person</th>
  </tr>

  <tr class="item">
    <td>user:0001</td>
    <td>UK</td>
    <td>Melissa</td>
  </tr>
  <tr class="item">
    <td>user:0002</td>
    <td>France</td>
    <td>Justin</td>
  </tr>
  <tr class="item">
    <td>user:0003</td>
    <td>San Francisco</td>
    <td>Judy</td>
  </tr>
  <tr class="item">
    <td>user:0004</td>
    <td>Canada</td>
    <td>Skipper</td>
  </tr>
  <tr class="item">
    <td>user:0005</td>
    <td>Christchurch</td>
    <td>Alex</td>
  </tr>

</table>

Answer 2

檢查您是否可以使用下面提到的任何 JQuery 插件。簡直太棒了，提供了廣泛的工作選項，並且整合起來更省力。 :)

https://github.com/paulopmx/Flexigrid - Flexgrid
http://datatables.net/index - 資料表。
https://github.com/tonytomov/jqGrid

如果沒有，您需要有一個指向那些呼叫伺服器端腳本來呼叫排序的表頭的連結。