I'm trying to call a function when new data gets added to a table in a view, but it's not working.
I have two models, client and user. A client has many users.
My view to list clients looks like this:
<table class="table table-striped" id="admin-table">
<thead>
<tr>
<th>Primary User</th>
<th>User Email</th>
<th>Join Date</th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
primaryUser is a computed property containing the first user for each client.
primaryUser: Ember.computed('users', function(){
return this.get('users.firstObject');
})
Problem
I'm using the jquery tablesorter library which adds sorting and filtering to the table. Because the primaryUser get's loaded by AJAX I need to call $('#admin-table').trigger('update') when new data is added in order to have the library index the new information.
Here's what I'm doing:
modelObserver: function() {
Ember.run.next(this, this.updateTable);
}.observes('model.@each.primaryUser')
I've tried both run.next, and run.scheduleOnce('afterRender'..) and the result is always the same. The updateTable function triggers before all of the primaryUser objects are rendered.
Here's what happens if I put a debugger within this.updateTable:
it only triggers once, when a cached user (me) is rendered. The empty cells in this table populate a few ms later when the rest of the user information is ajaxed in, but updateTable never re-runs.
Help
Is there a way to trigger an event once all objects have been rendered?
Aucun commentaire:
Enregistrer un commentaire