代码之家  ›  专栏  ›  技术社区  ›  Val

如何从TableSorter插件获取当前排序顺序?

  •  10
  • Val  · 技术社区  · 15 年前

    我刚刚开始使用ChristianBach优秀的TableSorter插件,我需要获得一个列当前的排序方向。我有几个专栏:

    • 身份证件
    • 名字
    • 类别

    ID和名称设置为不可排序,使用

    headers:    { 0: {sorter: false}, 1: {sorter: false} }
    

    我在name上添加了一个单击处理程序,以便它在category列上触发sort事件。使用示例“ Sort table using a link outside the table “,我可以让名称头触发类别排序——但很难编码为朝一个方向排序。

    我如何才能让它看到分类列当前排序的当前方向,并按相反的方向排序?(我可以处理翻转值;因为排序顺序是0或1,所以我可以对值执行异或运算以得到相反的结果,比如 var sort; sort ^= sort; --我的问题是如何得到当前值。

    下面是当前在“名称”列上设置单击处理程序的代码:

    $("#nameCol").click(function() {
        var sorting = [[2, 0]];     /* sort 3rd col (Category) descending */
        $("#SearchResults").trigger("sorton", [sorting] );  /* SearchResults is the ID of the sortable table */
        return false;               /* cancel default link action on a#nameCol */
    });
    

    谢谢!

    4 回复  |  直到 6 年前
        1
  •  1
  •   2dvisio    11 年前

    表标题都应调用相同的Click事件:

    $('th').click(function() {
         handleHeaderClick(this);
    });  
    

    然后单击处理程序应添加/删除适用的类。

    function handleHeaderClick(hdr) {
        if ($(hdr).hasClass('headerSortDown') == true) {
            $(hdr).removeClass('headerSortDown');
            $(hdr).addClass('headerSortUp');
        } else if ($(hdr).hasClass('headerSortUp') == true) {
            $(hdr).removeClass('headerSortUp');
            $(hdr).addClass('headerSortDown');
        } else {
            $('th', myTable).removeClass('headerSortUp headerSortDown');
            $(hdr).addClass('headerSortDown');
        }
        doSomething();
    };
    

    我希望这有帮助。

        2
  •  23
  •   Brendan Nee Joel    6 年前

    你可以使用内置的 sortEnd 获取SortOrder的事件,如下所述: https://stackoverflow.com/a/4150187/363155

    $('#yourtableId').on('sortEnd', function(event) {
        // Prints the current sort order to the console
        console.log(event.target.config.sortList);
    });
    
        3
  •  9
  •   e-motiv    10 年前

    您还可以在外部、任何其他地方(例如,在您的函数中,从Ajax开始,…)捕获它,并且仅在需要时捕获,而不是每次单击时捕获,这样的开销会稍微少一些:

    lastSortList=$("#mytable")[0].config.sortList;
    

    以及在Ajax更新后对其进行排序的示例:

    $("#mytable").trigger("sorton", [lastSortList]);
    

    不过,记住在正确的范围内声明第一行。

        4
  •  3
  •   Rochelle C    12 年前

    我编写了一个函数来保存当前的排序顺序。这帮助我走出了一个桌子是从零开始重建的局面。

    function SaveSortOrder(tablename) {
    //returns an array of a tablesorter sort order
    var hdrorder = new Array();
    var hdrs = $("#" + tablename + " th");
    var arrayindex = 0;
    hdrs.each(function (index) {
        if ($(this).hasClass('headerSortDown')) {
            hdrorder[arrayindex] = [index, 0];
            arrayindex++;
        }
        else if ($(this).hasClass('headerSortUp')) {
            hdrorder[arrayindex] = [index, 1];
            arrayindex++;
        }       
    });
    
    return hdrorder;
    }