ワイズリマインダー

tablesorterのソート順を記憶しておく

tablesorterでソートした順番を記憶しておき
次回アクセス時にその順番で表示させる

DEMO
↑保存したクッキーは24時間後に破棄されます

<table id="table"><thead>
 <tr>
  <th>名前</th>
  <th>年齢</th>
  <th>身長</th>
 </tr>
</thead><tbody>
 <tr>
  <td>町田透</td>
  <td>53</td>
  <td>185</td>
 </tr>
 <tr>
  <td>鷹山敏樹</td>
  <td>68</td>
  <td>179</td>
 </tr>
 <tr>
  <td>大下勇次</td>
  <td>67</td>
  <td>176</td>
 </tr>
</tbody></table>

var s = [[0, 0]];
if(typeof $.cookie('tablesorterIndex') == "string" && typeof $.cookie('tablesorterSort') == "string") s = [[$.cookie('tablesorterIndex'), $.cookie('tablesorterSort')]];
$('#table').tablesorter({
 sortList : s
}).bind('sortEnd', function(e){
  $(this).find('th').each(function(index){
    if(!$(this).hasClass('headerSortUp') && !$(this).hasClass('headerSortDown')) return true;
    $.cookie('tablesorterIndex', index, { expires : 1 });
    $.cookie('tablesorterSort', $(this).hasClass('headerSortDown') ? '0' : '1', { expires : 1 });
    return false;
  });
});

今回使用したファイル
jquery [v3.3.1]
jquery.cookie [v1.4.1]
tablesorter [v2.0.5]

• ≪新しい記事へ
• 古い記事へ≫

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。