シン・TWSNMP開発日誌：ライブラリの機能を探す時に考え方の違いで苦労した

今朝は４時から開発開始です。
テーブル表示をDataTablesへ移行する作業の続きです。昨日調べていたテーブルのソート（並べ替え）処理を変更する方法が判明しました。
ライブラリの考え方の違いで見つけるのに苦労しました。
これまで使ったいたGrid.jsでは、

Custom sort | Grid.js

のようにデータを比較する関数を設定する方法でした。

     sort: {
        compare: (a, b) => {
          const code = (x) => x.split(' ').slice(-1)[0];
          
          if (code(a) > code(b)) {
            return 1;
          } else if (code(b) > code(a)) {
            return -1;
          } else {
            return 0;
          }
        }
      }

この影響でDataTablesでも比較する関数を設定する方法を、一生懸命探していましたが、なかなか見つかりません。これだけ高機能なライブラリなのにソートの処理を変更できないのではと諦めかけたのですが、頭がクリアになってから、もう一度調べると、答えは以外なところにありました。
ソートする関数を指定するのではなく、ソースとする時のデータを指定すればよかったのです。

columns.render

この設定は、表示する時のデータを返しますが、表示だけでなくソートする時のデータも、ここで設定できます。
IPアドレスの場合には

export const renderIP = (ip:string,type:string) => {
  if (type=="sort") {
    return ip.split(".").reduce((int, v) => (Number(int) * 256  +Number(v)) + "");
  }
  return ip;
}

のような関数で値を返せば、ソートする時は、数値で比較してくれるので、思った通りの順番になります。

 DataTablesにすると、いろいろ気になっていたところが、すべて解決できます。

初期状態で状態とIPアドレスでソートして表示するとか、ノードを削除したあと、表示した時にソートの状態を維持するとかです。

 DataTablesの使い方を思い出して、慣れてきたので、開発ペースがアップしました。Grid.jsでできなかったこともできるので調子がでてきました。

明日に続く