【问题标题】:Default secondary sort默认二级排序
【发布时间】:2012-06-01 07:14:34
【问题描述】:

我需要在帐户交易表上设置多列排序。我决定使用 jQuery DataTables。每当我单击列标题对该列(例如列 x)进行排序时,我希望它按列 3 对列 x 中的任何匹配项进行排序。如果我点击第 3 列,那么当第 3 列中有匹配项时,它应该按第 0 列排序。

我见过fnSortListenerfnSort,看起来我可以通过将它们附加到每一列来实现我的目标……但这似乎真的是多余的,因为每一列都需要对列进行二次排序3,第 3 列除外。

那么,有没有办法告诉 DataTables 总是对第 3 列进行二次排序,然后为第 3 列指定异常?

感谢任何帮助。我对这个插件很陌生。谢谢!

编辑

这就是我最终要解决的问题。第一个二维数组表示第一次点击时如何排序,第二个二维数组表示第二次点击时如何排序。

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']]);      
  }

【问题讨论】:

  • 当您说要按另一列中有匹配项的一列排序时,您能澄清一下您的意思吗?当单击的列中没有匹配项时,数据会发生什么情况?
  • 或者你只是说点击 x 列会先按 x 列再按第 3 列排序,除了第 3 列先按第 3 列再按第 0 列排序?
  • 另一种方法是让用户控制二级排序。如果他们点击两个不同的列,第一个将是次要的,第二个将是主要的 - 只要您使用 stable 排序。强制使用辅助密钥会阻止此操作。
  • 是的,业务需求 ;-)

标签: jquery sorting datatables multiple-columns


【解决方案1】:

虽然我认为您可以使用 aDataSortasSorting 列属性的组合来完成您想要做的事情,但它们确实有冗余,可能无法提供您需要的控制。

最少冗余的解决方案将是类似于以下代码的解决方案:

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 上标题为 "Sorting on multiple columns" 的论坛讨论

【讨论】:

  • 换句话说,不,我不能为二级排序指定默认列。真可惜。我已经实现了与您的建议类似的东西,但必须对表中的每一列都这样做。这就是我试图避免的。我制作了一个可重用的函数,您在每次调用 fnSort 时传入 2D 数组,并且它在每个函数调用中运行类似于上述代码的内容。我能做的最好的:(
  • @mkoryak:编辑问题以包含解决方案。
猜你喜欢
  • 1970-01-01
  • 2016-05-27
  • 2011-04-13
  • 1970-01-01
  • 1970-01-01
  • 2015-11-21
  • 1970-01-01
  • 1970-01-01
  • 2019-05-30
相关资源
最近更新 更多