なんちゃってプログラマのぼやき

BootStrapのDataTablesが簡単に実装できて使える！

下記のサイトにコードと、ライブラリがまるまる書いてあるので
それをコピペ、読み込むだけで実装完了。



https://datatables.net/examples/styling/bootstrap.html


デフォルトで、以下が設定されています。
・表示件数設定
・検索機能
・ソート機能
・ページング機能


もちろん、ただコピペするだけでは仕様が不完全。
オプションを指定して、カスタマイズしていきます。
いくつかオプションを記載します。

簡単なカスタマイズたけなら、javascriptに以下のように記載するだけでＯＫ。


$(document).ready(function() {
$('#example').DataTable();

//ここにオプションを記載

} );


オプション
// 大量データ利用時、「処理中」メッセージを表示するかを設定
bProcessing: true,
// 初期表示の行数設定
iDisplayLength: 100,
// ページングボタンの制御
// two_button:進むと戻る
// full_numbers:全ボタン表示
sPaginationType: "full_numbers",
// 改ページを有効にするか設定
bPagenate: true,
// ソート行を強調（cssクラスを指定）するかを設定
bSortClasses: false,
//検索（フィルタ）を表示するかを設定
bFilter:false,
//画面の表示件数を選択可能かを設定
bLengthChange:false
// 自働列幅の計算を有効にするか設定
bAutoWidth: true,
// テーブル情報の表示を有効にするか設定
binfo: true,
// 水平スクロールを有効にするか設定
sScrollX: faulse;
// 垂直方向のスクロールを有効にするか設定
sScrollY: faulse;

使いそうなものを抜粋しました。他にも探せばあります。