2

trying to get a head around start up events...

so I created a fiddle http://jsfiddle.net/erichbschulz/59cDq/ for this

this:

console.log("starting");  
MyInnerApp = new Backbone.Marionette.Application();
MyOuterApp = new Backbone.Marionette.Application();
MyInnerApp.addInitializer(function(options){
  console.log("MyInnerApp initializer running");  
});
MyOuterApp.addInitializer(function(options){
  console.log("MyOuterApp Initializer running");  
});
$(document).ready(function(){
  console.log("$(document).ready");
  MyInnerApp.start();
});
MyOuterApp.start();
console.log("end of file");

I discovered the marionette code fires before $(document).ready()... but is this always the case?

and what is the role of $(document).ready() in a marionette app?

edit: thanks to Bryan for mentioning initialize:after updated fiddle

ErichBSchulz
  • 12,945
  • 5
  • 47
  • 50
  • I generally call `start` method after I am done loading application dependencies (I use `RequireJS` for loading them). – deven98602 May 07 '13 at 14:13

2 Answers2

3

You've probably long resolved this issue...

Essentially, there is no relationship between a Marionette app and $(document).ready().

$(document).ready() is a callback that fires when the DOM is fully loaded. However, you don't need it if you load your js at the bottom of your html document.

If for any reason you can not move your js to the bottom of the html document, then you would need to run any code that depends on the DOM (such as a call to .render()) to be inside of the $(document).ready() callback.

Community
  • 1
  • 1
uglymunky
  • 4,596
  • 6
  • 32
  • 47
2

addInitializer() runs when the App is initialized (MyInnerApp = new Backbone.Marionette.Application()). There are other App events that can be used :after the app is initialized or when it has been started.

https://github.com/marionettejs/backbone.marionette/blob/master/docs/marionette.application.md#application-event

MyInnerApp.on("initialize:after", function(){
  console.log("MyInnerApp initialize:after");  
});

MyInnerApp.on('start', function(){
  console.log("MyInnerApp start");  
});

http://jsfiddle.net/bryanbuchs/uMTnv/

bryanbuchs
  • 452
  • 2
  • 7
  • thanks Bryan - I should have mentioned I read the doco :-) but the initialize:after event is relevant. It too seems untied to document readyso really this question is about document ready. I've updated the fiddle to include initialize:after – ErichBSchulz May 07 '13 at 23:48