0

我有一个在单击搜索按钮时动态生成的表格，如下所示：

puts "<table class=\"resultsTable\">"
        puts "<tr><th colspan=\"10\" class=\"head\">Search Results</th></tr>"
        puts "<tr>"
        puts    "<th></th>"
        puts    "<th>App</th>"
        puts    "<th>Name</th>"
        puts    "<th>Region</th>"
        puts    "<th>Market</th>"
        puts    "<th>Language</th>"
        puts    "<th>Function</th>"
        puts    "<th>LOB</th>"
        puts    "<th>Term</th>"
        puts    "<th>Call</th>"
        puts "</tr>"
        puts "<tr>"
        puts    "<td id=\"$cellID\">"
        puts    "<img src=\"images/magnifier.gif\" style=\"cursor:pointer\" onclick=\"showRouting({'spec':'${specific}', 'id':'${mkt_id}', 'name':'${mkt_name}', 'xfer':'${xfertype}', 'cell':'${cellID}'})\"</img>"
        puts    "</td>"
        puts    "<td>$level</td>"
        puts    "<td>$name</td>"
        puts    "<td>$reg_name</td>"
        puts    "<td>$link</td>"
        puts    "<td>$lang</td>"
        puts    "<td>$func</td>"
        puts    "<td>$lob</td>"
        puts    "<td>$term</td>"
        puts    "<td>$call</td>"
        puts "</tr>"

我可以启用某种排序，以便我可以按每一列（按应用程序、名称等）排序吗？我见过某种 jquery 表排序器和其他东西，但我无法用我的代码做到这一点。有人可以告诉我我将如何去做吗？

[0,0][1,0] 是什么意思？我将如何相应地修改我的代码？：

$(document).ready(function() 
    { 
        $("#myTable").tablesorter( {sortList: [[0,0], [1,0]]} ); 
    } 
);
4

2 回答 2

2

您可以使用此处列出的插件-> http://datatables.net/release-datatables/examples/basic_init/table_sorting.html

于 2012-05-30T15:20:31.313 回答
2

您可以使用http://datatables.net/ 或http://tablesorter.com/docs/#Demo

对于像这样设置的表排序器

// call the tablesorter plugin 
    $("table").tablesorter({ 
        // sort on the first column and third column, order asc 
        sortList: [[0,0],[2,0]] 
    });

其中 sortList：[[0,0],[2,0]]包含列索引（基于 0）和排序顺序。

所以[[0,0],[2,0]]意味着第一列和第三列将是可排序的，最初它们将按升序排序。

检查这个工作小提琴，其中选项已正确注释。

这里有一个非常基本的版本，所有表格列都是可排序的，但没有图形，例如箭头或背景。

于 2012-05-30T15:20:43.667 回答