2015-08-24 31 views
0

我嘗試使表格可排序。這是它目前的樣子:使用jQuery和插件創建表格可排序

<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到表中。

請讓我知道如何使這項工作。

+1

你初始化排序這個插件用來排序你的表'$('。tablesorter')。tablesorter();'如文檔中所解釋的那樣? http://tablesorter.com/docs/#Getting-Started –

回答

1

看起來你已經錯過了初始化:

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

從文檔:

首先告訴的tablesorter你的表當文檔加載