sideNavLayoutView requires refresh to display on Event page after first visit to the page

app.js

var app = new Backbone.Marionette.Application();

/* add the main region to the application */
app.addRegions({
  appRegion: '#AppBase'

});

/* define the module we will be using to create this app */
app.module('RouteTest',function(module, App, Backbone, Marionette, $, _){
  "use strict";

  /* the layout for the main view */
  module.AppLayoutView = Marionette.LayoutView.extend({
    tagName: 'div',
    id: 'AppLayoutView',
    template: '#template-AppLayoutView',

    regions: {
      'contentRegion': '#ContentRegion',
      'sideNavRegion': '#SideNavRegion'
    },
    ui: {
      'navHome': '#nav-home',
      'navAbout': '#nav-about',
      'navProfile': '#nav-profile',
      'navAdmin': '#nav-admin',
      'navEvent': '#nav-event'
    },
    events: {
      'click #nav-home': 'onNavHomeClicked',
      'click #nav-about': 'onNavAboutClicked',
      'click #nav-profile': 'onNavProfileClicked',
      'click #nav-admin': 'onNavAdminClicked',
      'click #nav-event': 'onNavEventClicked'
    },

    /* when the view initializes, call initRouter to */
    
    initialize: function() {
      this.initRouter();
    },

    /* once the DOM is ready, start the Backbone history manager.
      This will cause the application to synch up with the
      current route of the browser.
      This must be called onRender instead of on initialize
      because it immediately tries to render the appropriate view
      into the contentRegion. Also: If you don't start the backbone
      history, the router won't work. */
      
    onRender: function() {
      if( ! Backbone.History.started) Backbone.history.start();
    },

    /* initialize the AppRouter, which synchs the application
      to the browser navigation */
    initRouter: function() {

      // cache reference to 'this' in the module scope
      var capturedThis = this;

      // assign route handlers to specific routes.
      var appRouteHandler = {
        '' : 'onHomeRoute',
        'home' : 'onHomeRoute',
        'about' : 'onAboutRoute',
        'profile': 'onProfileRoute',
        'admin': 'onAdminRoute',
        'event': 'onEventRoute'
      }

      // controller which contains the methods which
      // are used as route handlers. These are referenced
      // in the appRoutes object above.
      var appRouterController = {
        onHomeRoute: function() {
          capturedThis.onHomeNavigated();
        },
        onAboutRoute: function() {
          capturedThis.onAboutNavigated();
        },
        onProfileRoute: function() {
          capturedThis.onProfileNavigated();
        },
        onAdminRoute: function() {
          capturedThis.onAdminNavigated();
        },
        onEventRoute: function() {
          capturedThis.onEventNavigated();
        }
      };

      // define an AppRouter constructor
      var router = Marionette.AppRouter.extend({});

      // create a new instance of the AppRouter
      // and assign the routes and controller
      var appRouter = new router({
        appRoutes: appRouteHandler,
        controller: appRouterController
      });
    },

    /* called when the router sees that we have met the criteria
      to trigger the 'onHomeRoute' handler */
    onHomeNavigated: function() {

      // define and display an instance of the HomeLayoutView
      var homeLayoutView = new module.HomeLayoutView();
      this.contentRegion.show(homeLayoutView);

      // update the navigation
      this.$el.find('.navButton.active').removeClass('active');
      this.ui.navHome.addClass('active');
    },

    /* called when the router sees that we have met the criteria
      to trigger the 'onAboutRoute' handler */
    onAboutNavigated: function() {
      var aboutLayoutView = new module.AboutLayoutView();
      this.contentRegion.show(aboutLayoutView);
      this.$el.find('.navButton.active').removeClass('active');
      this.ui.navAbout.addClass('active');
    },

    onProfileNavigated: function() {
      var profileLayoutView = new module.ProfileLayoutView();
      this.contentRegion.show(profileLayoutView);
      this.$el.find('.navButton.active').removeClass('active');
      this.ui.navProfile.addClass('active');
    },

    onAdminNavigated: function() {
      var adminLayoutView = new module.AdminLayoutView();
      this.contentRegion.show(adminLayoutView);
      this.$el.find('.navButton.active').removeClass('active');
      this.ui.navAdmin.addClass('active');
    },

    onEventNavigated: function() {
      var eventLayoutView = new module.EventLayoutView();
      var sideNavLayoutView = new module.SideNavLayoutView();
      this.contentRegion.show(eventLayoutView);
      this.sideNavRegion.show(sideNavLayoutView);
      this.$el.find('.navButton.active').removeClass('active');
      this.ui.navEvent.addClass('active');
    }
  });

  /* view definition for the 'Home' screen */
  module.HomeLayoutView = Marionette.LayoutView.extend({
    tagName: 'div',
    id: 'HomeLayoutView',
    className: 'contentLayout',
    template: '#template-HomeLayoutView'
  });

  /* view definition for the 'About' screen */
  module.AboutLayoutView = Marionette.LayoutView.extend({
    tagName: 'div',
    id: 'AboutLayoutView',
    className: 'contentLayout',
    template: '#template-AboutLayoutView'
  });

  /* view definition for the 'Profile' screen */
  module.ProfileLayoutView = Marionette.LayoutView.extend({
    tagName: 'div',
    id: 'ProfileLayoutView',
    className: 'contentLayout',
    template: '#template-ProfileLayoutView'
  });

  /* view definition for the 'Admin' screen */
  module.AdminLayoutView = Marionette.LayoutView.extend({
    tagName: 'div',
    id: 'AdminLayoutView',
    className: 'contentLayout',
    template: '#template-AdminLayoutView'
  });

  /* view definition for the 'Event' screen */
  module.EventLayoutView = Marionette.LayoutView.extend({
    tagName: 'div',
    id: 'EventLayoutView',
    className: 'contentLayout',
    template: '#template-EventLayoutView'
  });

  /* view definition for the 'SideNav' region */
  module.SideNavLayoutView = Marionette.LayoutView.extend({
    tagName: 'ul',
    id: 'SideNavLayoutView',
    className: 'sideNavLayout',
    template: '#template-SideNavLayoutView'
  });

  /* add initializer, which fires when the app starts */
  module.addInitializer(function(){
    var layout = new module.AppLayoutView();

    /* show the layout in the region we created at the top of this file */
    app.appRegion.show(layout);
  });
});

/* when the DOM for this page is available, start the application */
$(document).ready(function() {
  app.start();
});