DataTablesのパラメータ設定方法

Tweet

Pocket

jQuery のテーブルプラグインである、DataTables のパラメータ設定について紹介します。項目名の説明はググれば見つかったのですが、実際どうやって設定するの？という部分が日本語で見つからなかったので紹介しておきます。

	var table = $('#resulttable').DataTable({
		/ * 一度に表示する行のセレクトボックス値 */
		"aLengthMenu": [ 10, 25, 50, 100, 200 ],
		/* aLengthMenu のデフォルト値 */
		"iDisplayLength": 50,
		/ * previous, next などの文字列を日本語に変更したい時 */
		"language": {
			"paginate": {
				"previous": "前へ",
				"next": "次へ",
				"first": "先頭へ",
				"last": "最後へ",
				"emptyTable": "エントリーがありません",
				"zeroRecords": "キーワードが見つかりません"
			}
		},
		/* 初期表示でソートする行の設定 */
		"order": [[ 6, "desc" ]],
		/* ソート機能を無効にする列を設定する場合 */
		"columnDefs": [
			{
				"targets": [ 0 ],
				"bSortable": false
			},
			{
				"targets": [ 11 ],
				"bSortable": false
			}
		]
	});

	table.search( '検索ワード' ).draw();

しかし、いくつか日本語に切り替わらない文字列があったので、jquery.dataTables.js を直接編集してしまいました。

--- a/media/js/jquery.dataTables.js
+++ b/media/js/jquery.dataTables.js
@@ -10910,7 +10910,7 @@
			 *      } );
			 *    } );
			 */
-			"sInfo": "Showing _START_ to _END_ of _TOTAL_ entries",
+			"sInfo": "_START_ - _END_ / 全エントリー _TOTAL_",
	
	
			/**
@@ -10931,7 +10931,7 @@
			 *      } );
			 *    } );
			 */
-			"sInfoEmpty": "Showing 0 to 0 of 0 entries",
+			"sInfoEmpty": "0 - 0 / 全エントリー 0",
	
	
			/**
@@ -10953,7 +10953,7 @@
			 *      } );
			 *    } );
			 */
-			"sInfoFiltered": "(filtered from _MAX_ total entries)",
+			"sInfoFiltered": "(全 _MAX_ エントリー中)",
	
	
			/**
@@ -11071,7 +11071,7 @@
			 *      } );
			 *    } );
			 */
-			"sLengthMenu": "Show _MENU_ entries",
+			"sLengthMenu": "表示中 _MENU_ エントリー",
	
	
			/**
@@ -11151,7 +11151,7 @@
			 *      } );
			 *    } );
			 */
-			"sSearch": "Search:",
+			"sSearch": "検索:",
	
	
			/**
@@ -11209,7 +11209,7 @@
			 *      } );
			 *    } );
			 */
-			"sZeroRecords": "No matching records found"
+			"sZeroRecords": "キーワードが見つかりません",
		},
	
	

Tweet

Pocket

• 公開日: 2017.09.08 　最終更新日: 2017.09.08