使用 jQuery 和插件使表格可排序

Question

我正在尝试使我的表格可排序。这是它目前的样子：

<table class="table table-bordered table-hover employement_request_panel tablesorter">
      <thead>
        <tr>
          <th></th>
          <th></th>
          <th class="center">Name <i class="fa fa-angle-double-down"></i></th>
          <th class="center">IQ <i class="fa fa-angle-double-down"></i></th>
          <th class="center">Efficiency <i class="fa fa-angle-double-down"></i></th>
          <th class="center">Focus <i class="fa fa-angle-double-down"></i></th>
          <th class="center">Happiness <i class="fa fa-angle-double-down"></i></th>
          <th class="center">Quality <i class="fa fa-angle-double-down"></i></th>
          <th class="center">Salery <i class="fa fa-angle-double-down"></i></th>
        </tr>
      </thead>

      <tbody>
      <%Employe.where(company_id: company.id, request: true).each do |employe|%>
        <tr>
          <td class="center cd-popup-trigger popup1"><i style="color: green;" class="fa fa-check"></i></td>
          <td class="center cd-popup-trigger popup2"><i style="color: red;" class="fa fa-close"></i></td>
          <td class="center js-employee-name"><%=employe.name%></td>
          <td class="center"><%=employe.iq%></td>
          <td class="center"><%=employe.efficiency%></td>
          <td class="center"><%=employe.focus%></td>
          <td class="center"><%=employe.happiness%></td>
          <td class="center"><%=employe.quality.capitalize%></td>
          <td class="center"><%=employe.salery%></td>
          <td class="js-employee-id" style="display:none;"><%=employe.id%></td>
        </tr>
      <%end%>
      </tbody>
    </table>

但我无法让它工作。我正在使用tablesorter 尝试对我的表进行排序。我正在调用<%= javascript_include_tag('jquery.tablesorter.min.js') %> 和 jQuery，但我的表不是不可排序的，或者至少我无法通过单击 <th> 让它们在 web 应用程序上排序。我还在表格中添加了 tablesorter 类。

请告诉我如何完成这项工作。

Answer 1

看起来你错过了初始化：

    $(function() {
        $('.tablesorter').tablesorter();
    });

来自文档：

首先告诉 tablesorter 在文档完成时对表格进行排序 已加载