我有一个aspx页面,看起来像这样:
Some label Some complex control Some label Some complex control Some label Some complex control
加载页面后,我想根据用户先前选择的顺序(存储在数据库中)对这些行重新排序
我如何使用JQuery/JS来实现这一目标?
编辑:
我遇到了appendTo代码的性能问题.一个10行的表需要400ms,这是非常不可接受的.任何人都可以帮我调整性能吗?
function RearrangeTable(csvOrder, tableId) { var arrCSVOrder = csvOrder.split(','); //No need to rearrange if array length is 1 if (arrCSVOrder.length > 1) { for (var i = 0; i < arrCSVOrder.length; i++) { $('#' + tableId).find('[fieldname = ' + arrCSVOrder[i] + ']').eq(0).parents('tr').eq(0).appendTo('#' + tableId); } } }
Darin Dimitr.. 10
为什么不在服务器端订购行?如果要在加载页面后立即使用JQuery对它们进行重新排序,那么在服务器代码中执行此作业会更有效,尤其是在用户选择的顺序存储在数据库中时.
为什么不在服务器端订购行?如果要在加载页面后立即使用JQuery对它们进行重新排序,那么在服务器代码中执行此作业会更有效,尤其是在用户选择的顺序存储在数据库中时.
试试jQuery tablesorter插件.
加载文档时,您可以通过指定要排序的列索引对表进行排序(并允许按多列排序):
$(document).ready(function() { $("#myTable").tablesorter( {sortList: [[0,0], [1,0]]} ); } );
做这样的事情:
假设你有这样的表:
.... |
.... |
.... |
.... |
和一个像这样的新订单的数组:
NewOrder[1] = 3; NewOrder[2] = 4; NewOrder[3] = 2;
然后,做一些这样的事情(没有经过测试,所以你可能需要调整代码,但这是想法):
for ( i=1; i<=NewOrder.length; i++ ) { $('#row'+i).appendTo( '#table' ); }
这样,它们按顺序移动到表的末尾.
所以你将有3个移动到最后,然后4个移动到它后面,然后2个移到它后面等等.在他们将ALL全部附加到表的末尾之后,第一个将成为第一行,其余的将在它背后的正确顺序.
编辑:
使表格样式='display:none;' 然后执行$('#table').show(); 在启动时.
再次编辑: 你可以围绕整个身体内容做一个div,比如
....
因此,整个页面将被隐藏(只是空白),只需加载和订购表所需的时间.
然后你会用:
$(function(){ $('#everything').show(); }
一旦DOM准备就绪,立即显示整个页面.加载页面需要花费不到一秒的时间,但它会一次加载,所以不会有任何闪存丢失的表等等.只要一切都在#everything中,它只会看起来喜欢加载的页面 - 应该对查看器透明.