3ステップで表をソート&値を検索できるjavascript「dataTables」

サイト制作でよく使用するものの一つにテーブルで作成する表だと思います。
しかし、その整理方法は面倒で、縦に長くなると見づらくなります。
今回紹介するDataTablesはjQueryを使い簡単に表をソートさせたり、値を検索したり、表示する項目数を調整できます。
3ステップで表をソート&値を検索できるjavascript「dataTables」サンプル

使用方法 非常に簡単に導入できます。
[ STEP1 ]
DataTablesからjquery.dataTables.jsをjQueryからjquery.jsをダウンロードします。
[ STEP2 ]<
以下のようにhead内に記述します。
<script src="http://yourdomain/jquery.js" type="text/javascript"></script>
<script src="http://yourdomain/jquery.dataTables.js" type="text/javascript"></script>
$(document).ready(function() {
$('#id名').dataTable();
} );
</script>

[ STEP3 ]
上記で指定したid名をtableに付与します。
3ステップで表をソート&値を検索できるjavascript「dataTables」サンプル

sponsors

「3ステップで表をソート&値を検索できるjavascript「dataTables」」をシェアする

記事作成:
記事URL:

TOP > > > 3ステップで表をソート&値を検索できるjavascript「dataTables」