啓文社 - 2012.03.15 [jQuery] DataTables で表組の並べ替え

トップ > 2012年 > 2012.03.15 [jQuery] DataTables で表組の並べ替え

[jQuery] DataTables で表組の並べ替え

2012.03.15記

jQuery で表組みに装飾や並べ替えができる「DataTables」を試してみました。
http://datatables.net/

No.	季節	果物	日付	曜日	価格
1	冬	りんご	2012/1/1	Mon.	200
2	夏	バナナ	2011/1/25	Tue.	150
3	夏	レモン	2010/9/10	Wed.	300
4	春	いちご	2000/3/24	Thu.	400
5	冬	蜜柑	2012/3/15	Fri.	250
6	春	キュウイ	1999/9/9	Sat.	100
7	夏	マンゴー	2012/2/29	Sun	50
8	夏	パイナップル	2006/4/4	Mon.	600
9	秋	柘榴	2005/11/3	Tue.	350
10	秋	イチジク	2012/3/17	Wed.	120
11	春	桃	2003/7/18	Thu.	70
12	秋	柿	2011/12/29	Fri.	60
13	夏	ブルーベリー	2012/11/11	Sat.	550
14	夏	葡萄	2012/11/1	Sun	450
No.	季節	果物	日付	曜日	価格

こんな感じで記述しました

<link rel="stylesheet" type="text/css" media="all" href="/parts/datatable/css/jquery.dataTables.css" />
<script type="text/javascript" language="javascript" src="/parts/datatable/jquery.dataTables.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	$('#dataTable').dataTable({
		"aLengthMenu":[3,5,10,20,50,100]
	});
});
</script>

<table id="dataTable" cellspacing="0" border="0" class="display">
<thead>
<tr><th>No.</th><th>季節</th><th>果物</th><th>日付</th><th>曜日</th><th>価格</th></tr>
</thead>
<tbody>
<tr><td>1</td><td>冬</td><td>りんご</td><td>2012/1/1</td><td>Mon.</td><td>200</td></tr>
・
・

日本語化ってどうやってやるんだろう？
上記表組みの「曜日」のようなものをソートする場合、ソート順の指定をすることが可能なのだろうか？

----
http://baalzephon.dyndns.org/tech/index.php?JavaScript%2FjQuery%2FDataTables

この記事の1行目に飛ぶ

2012.04.15 Google Apps Script

2012年

2012.02.15　PHPExcel で罫線を引く