山口建設のロゴ 山口建設

IT / 仕事

DataTablesで、カンマ付、単位付きの複数列の並び替えを実施する。

DataTables

山口建設では、基幹システムを内製で作っています。

その中で非常に重宝している一つが、DataTablesです。

基本的な利用方法は非常にわかりやすく説明しているページにおまかせするとして、今回はカンマ付、単位付の列を複数ソートする方法が中々見当たらなかったのでまとめてみたいと思います。

一つの列としては、こちらのページが非常にわかりやすく解説されています。

カンマ付、単位付の列を数値順に並び替えます

並び替えの方法としては、下記となります。

Currencyのプラグインを導入

  • CDNだと楽ちんですが、sortとtype-detectionで種類が違うCurrencyプラグインがあるので要注意。

該当列にcurrencyを設定

  • 1列目の場合はtargetsに0を設定します。
  • 2列目の場合は1、以下同順…
colmnDefs :[{
 type : 'currency',
 targets : 1
}]

複数列の場合は?

  • 表の構成ですが複数列にカンマ付、単位付の列が来ることがあると思います。
  • 仮に5列目と、7列目に来る場合は下記のように対処します。
colmnDefs :[{
 type : 'currency',
 targets : [4,6]
}]

複数列に同時にCurrencyを当てる方法を書いているページが少なかったのでまとめてみました。

ただし、同一ページに複数のtableがあり、それぞれに複数の列をCurrencyで指定すると片方が外れるという事象に悩んでいます。

プラグインの都合じゃないような気もする…。

CONTACT

その住まいの答えを、
いっしょに探しませんか。

  • 創業1990年
  • お客様満足度4.9
  • Googleクチコミ ★4.6
  • 練馬で36年