CODEWITHSUNDEEP
javascriptbackbone.jsmarionette
Tomas
Tomas

Reputation: 13

MarionetteJS Example from Backbone.Marionette. A Gentle Introduction not working

I have been reading this book I tried the first example, but It doesn't render the templates, it only shows the text by default. When I open the console, the app ContactManager exits and it's initialiazed.

<!DOCTYPE html>

 <html lang="en">

   <head>

    <!--  <meta charset="utf-8"> -->

     <title>Marionette Contact Manager</title>

     <link href="./assets/css/bootstrap.css" rel="stylesheet">

     <link href="./assets/css/application.css" rel="stylesheet">

   </head>



   <body>



     <div class="navbar navbar-inverse navbar-fixed-top">

       <div class="navbar-inner">

         <div class="container">

           <span class="brand">Contact manager</span>

         </div>

       </div>

     </div>



     <div id="main-region" class="container">

       <p>Here is static content in the web page. You'll notice that it gets

       replaced by our app as soon as we start it.</p>

     </div>



     <script type="text/template" id="static-template">

       <p>This is text that was rendered by our Marionette app.</p>

     </script>





     <script src="./assets/js/vendor/jquery.js"></script>

     <!--<script src="./assets/js/vendor/json2.js"></script>-->

     <script src="./assets/js/vendor/underscore.js"></script>

     <script src="./assets/js/vendor/backbone.js"></script>

     <script src="./assets/js/vendor/backbone.marionette.js"></script>



     <script type="text/javascript">



         var ContactManager = new Marionette.Application();



         ContactManager.addRegions({

           mainRegion: "#main-region"

         });



         ContactManager.StaticView = Marionette.ItemView.extend({

           template: "#static-template"

         });



         ContactManager.on("initialize:after", function(){

           var staticView = new ContactManager.StaticView();

           ContactManager.mainRegion.show(staticView);

         });


     ContactManager.start();

 </script>

Upvotes: 1

Views: 437

Answers (2)

Arturo Soto
Arturo Soto

Reputation: 199

Update your "initialize:after" function by

ContactManager.addInitializer(function(){

    var staticView = new ContactManager.StaticView();

    ContactManager.mainRegion.show(staticView);

});

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

Thanks

Upvotes: 1

Josh
Josh

Reputation: 36

Try changing

ContactManager.on("initialize:after", function()

to

ContactManager.on("start", function()

Upvotes: 2

Related Questions