CODEWITHSUNDEEP
javascriptjquerymeteorrenderingmaterialize
jalagrange
jalagrange

Reputation: 2391

Exception from Tracker afterFlush function: undefined using Materialize modal

I am attempting to run materialize modal within my Meteor app. I have a template called "classrooms" where i am using an onRendered method like so:

 Template.classrooms.onRendered(function () {

   $('.modal-trigger').leanModal();

});

if I reload my page, the modal works fine. However once I navigate out of my page or reload my page on a different route and navigate back to "/classrooms/" I get the following error:

Exception from Tracker afterFlush function:

Followed by:

TypeError: $(...).leanModal is not a function
    at null.<anonymous> (classrooms.js:18)
    at template.js:116
    at Function.Template._withTemplateInstanceFunc (template.js:457)
    at fireCallbacks (template.js:112)
    at null.<anonymous> (template.js:205)
    at view.js:107
    at Object.Blaze._withCurrentView (view.js:538)
    at view.js:106
    at Object.Tracker._runFlush (tracker.js:497)
    at onGlobalMessage (setimmediate.js:102)

Has anybody run into this or know how to fix it?

Upvotes: 0

Views: 1828

Answers (1)

jalagrange
jalagrange

Reputation: 2391

I figured out what was going on. I was actually calling jQuery twice within my app. Let me explain.

Every meteor app is loaded with jQuery automatically once you call meteor create at the moment you create your app. View more info on Atmospheres page: https://atmospherejs.com/meteor/jquery

I was also manually inserting jquery on my layout.

By having both of these, this weird bug presented itself. However once I realized this and removed jQuery from the layout, everything fell into place. So make sure you are not initializing jQuery on your app to avoid these bugs.

Upvotes: 1

Related Questions