Skip to content Skip to sidebar Skip to footer

Sort A Table By The Name In A Cell

I have a table that is organized with folders. I have added a context menu where they can move a row to a different folder. I have the code working to change the cells of the sel

Solution 1:

The sorting itself isn't as slow as the browser re-rendering the table every time something changes. I recommend pulling the table out of the DOM, sorting it, then putting it back in place so the browser only renders it once.

var trs = $('#hiddenresult tbody tr.events').detach();
trs.sort(function(a, b) {
     var atxt = $(a).find('td.folderName').text().toLowerCase();
     var btxt = $(b).find('td.folderName').text().toLowerCase();
     return (atxt >= btxt) - (atxt <= btxt);
});
$('#hiddenresult tbody').append(trs);

Fiddle: http://jsfiddle.net/qDZXh/2/

Edit: detaching and appending will make the table flicker or disappear while the table is sorting. Alternatively you can use .clone(true) to copy the tbody with all of its events etc, then use .replaceWith at the end to swap them out.

Post a Comment for "Sort A Table By The Name In A Cell"