JavaScript
jQuery
DataTables

DataTablesでカスタムソート

More than 1 year has passed since last update.


ソースコード

See the Pen DataTables custom sort by umerin (@umerin) on CodePen.


メモ

columnDefsというオプションのcolumns.orderDataTypeに好きな名前を付けます。

columnDefs : [

{
'title' : '都道府県',
'data' : 'prefectures',
'targets' : 0,
'orderable' : true,
'orderDataType' : 'dom-jp' //今回はdom-jpにしました。
}
]

セルの情報ごとに数字かアルファベットを返すと、自動でソートしてくれます。

数字だと辞書順になってしまい、14より2が昇順で下になってしまうようです。

数字2ケタの文字列に変更しました。

※最新バージョンは確認していません

$.fn.dataTable.ext.order['dom-text'] = function(settings, col)

{
return this.api().column(col, {order:'index'}).nodes().map(function(td, i){

//ここに書いてあげます。

});
}

DataTablesの概要と使い方はこちらのQiita記事が参考になります。

こちらのブログを参考にさせていただきました。