Question

I need to sort some rows after they’ve been inserted. What I’m doing now is:

var $r = $tbody.find('tr').sort(function(a,b) { 
  return compare(taxstatusOf(a), taxstatusOf(b));
});
$tbody.empty().append($r);

This works, except that functions that were bound to elements contained in the rows are no longer bound (or no longer fire, which amounts to the same thing).

So, is there a right way to sort rows that doing fail like this? Do I have to re-bind?

Answer 1

D’oh.

The right answer, sports fans, is .detach(). .remove() is supposed to strip the removed elements bare (removing local data and bound functions and such), which is great for garbage-collection and so forth but exactly what you don’t want when you’re planning to re-attach them later.

The working code:

var $r = $tbody.find('tr').sort(function(a,b) { 
  return compare(taxstatusOf(a), taxstatusOf(b));
}).detach().appendTo($tbody);

(I’m not going to “accept” my own answer for a little while in case someone comes up with a better one.)

(I guess it’s good that I found the answer 30 seconds after posting the question. Now the next guy on SO will profit from my mistake.)