Running JQUERY Scripts after DOM is loaded in Meteor js?

1k views Asked by At

I want a jQuery script to load after all DOM elements are loaded. I tried to run through Template.Mytemplare.onRendered(); But that is not solving my problem, because DOM is not ready Yet. Also I am using Flow-router not Iron Router So I can not use Iron Router's onAfterAction hook or template's rendered callback? I also used subscriptions so I load DOM if subscription is ready Template.subscriptionReady. Any suggestions?

3

There are 3 answers

0
Arnaud Weil On

You could combine onRendered and jQuery's ready function:

Template.Mytemplate.onRendered(function() {
  $(function() {
      // your code goes here
  });
});
1
user3765023 On

The Problem is that when Template.myTemplate.onRendered(); is executed , the subscription is not ready yet , So DOM is not ready yet. as I have used Template.subscriptionsReady check before loading DOM. So There is a callback-function called OnReady() when subscribing. it will go like this :
Meteor.subscribe("somePublication", {onReady: function(){//code to perform after //subscription is ready goes here }})

0
Casey Gibson On

The best way to do it in Meteor now is with the below:

Template.MyTemplate.onRendered(function(){
    Tracker.afterFlush(function(){
        // run code in here
    });
});

Using afterFlush runs the code when the DOM has actually finished loading. You will need the Meteor "tracker" package, which is an official plugin.