満足への果てしない旅

2022/09/05

IT 仕事

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

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で指定すると片方が外れるという事象に悩んでいます。

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

リフォームのお見積り・プランニングなど、
お気軽にご相談ください

直接相談したいという方は
下記フリーダイヤルよりご連絡ください。
担当スタッフが対応させていただきます。