3

アカウント トランザクションのテーブルで複数列の並べ替えを設定する必要があります。jQuery DataTables を使用することにしました。列ヘッダーをクリックしてその列 (列 x など) を並べ替えるたびに、列 x の一致を列 3 で並べ替えるようにします。列 3 をクリックすると、列 3 に一致するものがあれば、列 0 で並べ替える必要があります。

fnSortListenerとfnSortを見てきましたが、これらを各列にアタッチすることで目標を達成できるように見えます...しかし、列3を除いてすべての列が列3で二次ソートを行う必要があるため、それは本当に冗長に思えます。

では、DataTables に常に列 3 でセカンダリ ソートを実行してから、列 3 の例外を指定するように指示する方法はありますか?

どんな助けでも大歓迎です。私はこのプラグインに非常に慣れていません。ありがとう！

編集

これが私が最終的に行ったものです。最初の 2D 配列は最初のクリックでの並べ替え方法を示し、2 番目の 2D 配列は 2 回目のクリックでの並べ替え方法を示します。

var Sorter = function($dataTable) {
  return {
    bindMultiSort: function(headerSelector, firstOrderTuples, secondOrderTuples) {
      var order = 0;
      this.removeSorting(headerSelector).click(function() {
        if (order === 0) {
          $dataTable.fnSort(firstOrderTuples);
          order = 1;
        } else {
          $dataTable.fnSort(secondOrderTuples);
          order = 0;
        }   
      }); 
    },  

    removeSorting: function(headerSelector) {
      var $header = $(headerSelector);
      $header.unbind('click');

      return $header;
    }   
  };  
};

  function attachSecondarySorting($transactionsTable) {
      var sorter = new Sorter($transactionsTable);
      sorter.bindMultiSort('#posted', [[POSTED_DATE_COL, "asc"], [DESCRIPTION_COL, "asc"]], [[POSTED_DATE_COL, "desc"], [DESCRIPTION_COL, "asc"]]);
      sorter.bindMultiSort('#received', [[RECEIVED_DATE_COL, 'asc'], [DESCRIPTION_COL, 'asc']], [[RECEIVED_DATE_COL, 'desc'], [DESCRIPTION_COL, 'asc']]);
      sorter.bindMultiSort('#category', [[TRANSACTION_TYPE_COL, 'asc'], [POSTED_DATE_COL, 'desc'], [DESCRIPTION_COL, 'asc']], [[TRANSACTION_TYPE_COL, 'desc'],
      sorter.bindMultiSort('#description', [[DESCRIPTION_COL, 'asc'], [POSTED_DATE_COL, 'desc']], [[DESCRIPTION_COL, 'desc'], [POSTED_DATE_COL, 'desc']]);    
      sorter.bindMultiSort('#moneyIn', [[MONEY_IN_COL, 'asc'], [DESCRIPTION_COL, 'asc']], [[MONEY_IN_COL, 'desc'], [DESCRIPTION_COL, 'asc']]);
      sorter.bindMultiSort('#moneyOut', [[MONEY_OUT_COL, 'asc'], [DESCRIPTION_COL, 'asc']], [[MONEY_OUT_COL, 'desc'], [DESCRIPTION_COL, 'asc']]);      
  }
4

1 に答える 1

1

aDataSortと列のプロパティを組み合わせてやろうとしていることを達成できると思いますがasSorting、それらには冗長性があり、必要な制御がまったく提供されない場合があります。

冗長性が最も少ないソリューションは、次のコードのようなものになります。

var theDataTable = $('#tableId').dataTable();  // with whatever options needed, of course

// unbind the default click event that is in place for sorting
// and replace it with your own calls to fnSort
$('#tableId thead th').unbind('click').click(function(){
    var aaSorting = oTable.fnSettings().aaSorting;
    var currentSortColumnIndex = aaSorting[0][0];
    var currentSortDirection = aaSorting[0][1];
    var clickedSortColumnIndex = $(this).index();

    var newSortDirection = 'asc';
    if(currentSortColumnIndex == clickedSortColumnIndex) {
        newSortDirection = (currentSortDirection == 'asc') ? 'desc' : 'asc';
    }

    if(clickedSortColumnIndex == 3) {
        oTable.fnSort( [ [3, newSortDirection], [0, newSortDirection] ] );
    }
    else {
        oTable.fnSort( [ [clickedSortColumnIndex, newSortDirection], [3, newSortDirection] ] );
    }
});

並べ替えの意図を適切に解釈した場合、これでうまくいくはずですが、そうでない場合は、必要なソリューションにほとんどたどり着けると思います。

注: 「複数の列での並べ替え」というタイトルのdatatables.netのフォーラム ディスカッションも参照してください。

于 2012-05-26T03:39:24.297 に答える