datatablesのrenderをカスタマイズ

最近datatablesをさわったので今更ながらまとめてみます。

エラーのアラートを無効にする

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

日本語化オプション

$.extend( $.fn.dataTable.defaults, {
        language: {
            url: "http://cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Japanese.json"
        }
        })

Number helper

{
    data: 'price',
    render: $.fn.dataTable.render.number( ',', '.', 2, '$' )
}

$.fn.dataTable.render.numberというヘルパー関数が用意されています。
使い方は
第一引数が1000ごとの区切り文字列、
第二引数が小数点の表し方、
第三引数は小数点以下第何位まで表示するか。0なら整数。
第四引数は必須ではありませんが、数値の先頭に￥記号や＄記号をつけたいときに使います。
Number helper

Number helperを使わないやり方

複数のカラムを使って値や文字列を合成する際はこのように書くこともできます。toFixed(3)で小数点第3位までに丸めています。

{ data: "average",
    render:function(data,type,row){
        var value=data;
        return row.id+'/'+value.toFixed(3);
    }
}

tdタグに動的にクラスを設定する

columnsあるいはcolumnDefsのオプションとして使います。
datatablesで生成されたtdタグ(セル)にclass属性をつけるときに使います。

"createdCell": function (td, cellData, rowData, row, col) {
    if ( rowData.rank==1 ) {
        //rankプロパティが1ならclass="important"を付加する
        $(td).addClass('important')
    }
}

createdCell