meteorjpanelmenu

jQuery widget (jPanelMenu) stops working on meteor route change


I have implemented jPanel Menu via a rendered template, which works great, until a route has been changed, then the menu stops working. Here is the code I am using to evoke the plugin.

  Template.mobileMenu.rendered = function(){
    var jPM = $.jPanelMenu({
        menu: '#mobile-menu',
        trigger: '.menu-trigger'
    });
    jPM.on();
  };

The template is loaded on all pages in the footer. I am thinking it needs to be rerun on route change, OR prevented from being rerun. I am not sure which. Thanks for any tips.


Solution

  • The solution was to wrap it in an if not rendered, to prevent it from being re-rendered on template / route changes.

    Template.mobileMenu.rendered = function(){
      if (!this.rendered){
    
        var jPM = $.jPanelMenu({
            menu: '#mobile-menu',
            trigger: '.menu-trigger'
        });
        jPM.on();
    
        this.rendered = true;
      }
    };