Edited at

DataTablesでのAjaxエラー処理

More than 1 year has passed since last update.

DataTablesはリッチなUIを備えたテーブルを作るためのjQueryプラグインで、Ajaxを使って検索条件に応じて動的に表データを読み込むことができます。Ajax処理にてサーバーサイドでエラーが発生したときに、DataTables側でエラー処理を実装する方法を探すのに苦労したので、調査結果をまとめています。


$.fn.dataTable.ext.errModeをnoneに設定してerrorイベントを受け取る

この方法ではエラーの発生を検知できるが、エラーレスポンスの内容を取得することはできない。

// エラー発生時にデフォルトで表示されるメッセージボックスを無効化する。

$.fn.dataTable.ext.errMode = 'none';

// errorイベントを受け取るハンドラ(エラーレスポンスの取得はできない。)
$('#example').on( 'error.dt', function ( e, settings, techNote, message ) {
console.log( 'An error has been reported by DataTables: ', message );
});


xhrイベントを受け取る

xhrイベントではレスポンス内容を取得できるため、ステータスコードやボディから正常応答かエラー応答かを判別して、エラー処理を実装することができる。

$('#example').on('xhr.dt', function ( e, settings, json, xhr ) {

// xhrオブジェクトからレスポンス内容を取得できる。
// ステータスコード: xhr.status
// ボディ(JSON): xhr.responseJSON

// error.dtイベントの発生を無効化するにはtrueを返却する。
return true;
});


参考情報

数年前のディスカッションでは、DataTables 1.10からajax.errorプロパティエラー処理を行う関数を登録できるようになるとの話もあったようだが、現在の仕様ではこのプロパティは存在しない。