CODEWITHSUNDEEP
backbone.jstablesorter
mendicant
mendicant

Reputation: 509

Tablesorter won't sort a table rendered by Backbone.js

I'm having issues getting tablesorter to work correctly with the following code:

el = this.view.render().el;
$("#players").html(el);
$("#players-table").tablesorter({
  theme: 'blue'
});

The table sorter styles get applied fine, but none of the columns will sort.

However, if I set a breakpoint in firebug on 3rd line, wait until the table renders then continue on, it works fine.

According to the .html() documentation for jQuery, .html() is a synchronous call. Shouldn't this mean that setting a breakpoint and "waiting" shouldn't have an effect? Is there something I am missing?

Upvotes: 0

Views: 402

Answers (2)

mendicant
mendicant

Reputation: 509

Turns out the issue was that I forgot about was the collection being fetched is async. So while this code was actually correct, it was running before the collection (which is passed to the view) was populated.

So the reason the breakpoint worked is that it gave the collection time to populate and render before going through and tablesorter-ing the table.

Upvotes: 1

Stepan Mazurov
Stepan Mazurov

Reputation: 1374

Without more context my best guest at fixing this would be to specifically target the jquery element $el instead of el. 

$("#players").html(this.view.render().el);
this.view.$el.tablesorter({
     theme: 'blue'
});

Upvotes: 0

Related Questions