Why onRendered does not allow table iteration


#1

I have this code

   Template.drone.onRendered(function () {
       var userid = Meteor.userId();
       
       $('.table > tbody > tr').each(function() {
       var friendid = $(this).find("td:first").html();
       var userid = Meteor.userId();
       alert('this rendered inside each');
       });
      });

and this is the template

Template name="drone">
               <table class="table">
        <thead>
            <tr>
                <th>Id</th>
                <th>Names</th>
                <th>Action</th>
            </tr>
        </thead>
        <tbody>
         {{#each allusers }}
            <tr>
                <td class="buttonId">{{_id}}</td>
                <td>{{profile.name}}</td>
                <td class="buttonAction">hi</td>
            </tr>
            {{/each}}
        </tbody>
    </table>
 </template>

The code above iterates a table and does something useful with the data from the table row,i.e id in each td.

I am wondering why this code alert('this rendered inside each'); never fires.


#2

{{allusers}} in your template may change over time. E.g. if you do not wait for subscriptions, it will be empty on first run.

This is what (possibly) happens here. Your renderd-callback is fired, once the drone-template is rendered. But at this time, the helper {{allusers}} will be empty. onRendered will only fire once for one drone-template-instance.

I do not know what you want to achive, but you should never iterate over the dom with jquery this way in blaze/meteor. After all, you know how the dom is rendered, so there is no reason to use it to get some data (like friendid)


#3

Thanks,for the explanation. I have my reasons for iterating the table.