2013-11-04 4 views
1

나는 현재이 코드로 분류되고있는 테이블이 있습니다여러 열을 기준으로 jQuery를 tablesorter에있는 테이블을 정렬

$(document).ready(function() { 
    $(".statisticstable").tablesorter({ 
     sortList: [ 
      [5, 0] 
     ], 
     textExtraction: function (node) { 
      if ($(node).hasClass('data')) { 
       return $(node).attr('value'); 
      } else { 
       return $(node).html(); 
      } 
     } 
    }); 
}); 

이 현재 그러나 나는에 추가하려고하고, 5 열을 기준으로 테이블을 정렬을 "좋아하는 행"기능을 사용하여 "선호 된"행을 맨 위에 밀어 넣고 나머지 정렬 된 목록을 뒤집습니다.

어쨌든 이것을 할 수 있습니까?

답변

1

당신이 원하는 것은 this StackOverflow question에 대한 답변과 같습니다 ... 기본적으로 사용자는 행 내의 상자를 체크하고 별도의 tbody로 이동합니다. 당신이 정렬은 "좋아"TBODY 내에서 행을 원하는 경우

<table id="fav" class="tablesorter"> 
    <thead> 
    <!-- make checkbox column unsortable "sorter-false" --> 
    <th class="sorter-false"></th> 
    <!-- etc --> 
    </thead> 

    <!-- add an "info" only (non-sorting) tbody --> 
    <tbody class="tablesorter-infoOnly"></tbody> 

    <tbody class="all"> 
    <tr> 
     <td><input type="checkbox" /></td> 
     <!-- etc --> 
    </tr> 
    <!-- etc --> 
    </tbody> 
</table> 

, 다음 tablesorter-infoOnly 클래스를 제거합니다. 여기

완전성에 대한 코드 & demo이다

$(function() { 

    var $table = $("#fav"); 
    $table.tablesorter({ sortList: [[0,0], [1,0]] }); 

    $table.on('click','input:checkbox', function() { 
    var $this = $(this); 
    if ($this.is(':checked')) { 
     $this.closest('tr').prependTo("#fav tbody.tablesorter-infoOnly"); 
    } else { 
     $this.closest('tr').appendTo("#fav tbody.all"); 
    } 
    $this.trigger('update'); 
    }); 
}); 
관련 문제