如何通过单击Jquery中的标题对表列进行排序?

时间:2017-10-25 06:55:03

标签: javascript jquery sorting jquery-ui tablesorter

我想通过单击表头来对表列字符串值进行排序。 在这里我做了字母排序。 请将此代码更改为String列排序。

enter code here
  var  sortOrder = -1;
    $(".sort").click(function () {
        sortOrder *= -1;
     sortTable($(this));
     });


  function sortTable(element) {
    var tbody = element.parent();
    var colIndex = element.index() -1;
    tbody.find('tr').sort(function (a, b)
    {
        $('td', a).eq(colIndex).text() === "" ? $('td', a).eq(colIndex).text("0") :   $('td', a).eq(colIndex).text();
        if (sortOrder === 1)
        {
            return parseInt($('td', a).eq(colIndex).text(), 10) - parseInt($('td', b).eq(colIndex).text(), 10);
        }
        else
        {
            return parseInt($('td', b).eq(colIndex).text(), 10) - parseInt($('td', a).eq(colIndex).text(), 10);
        }

    }).appendTo(tbody);
    tbody.find('tr').each(function () {
        $(this).removeClass();
        zebra = zebra === 'odd' ? 'even' : 'odd';
        $(this).addClass(zebra);
        $(this).find("td").eq(colIndex).text() === 0 ? $(this).find("td").eq(colIndex).text(""):$(this).find("td").eq(colIndex).text(); 
    });
}

2 个答案:

答案 0 :(得分:1)

使用jquery datatable js你会得到排序选项作为默认值,你也可以使用更多的选项,称为过滤器,分页等... reference

$(document).ready(function(){
    $('#myTable').DataTable();
});

答案 1 :(得分:0)

这是一个用于对表进行排序的jQuery插件:http://tablesorter.com/