I am confused by the Marionette (2.3.0) documentation from the link below that says the Application Regions feature is deprecated. A Layout View should be used instead. Does that mean I should not use MyApp.addRegions() any more? Then how should I add my Layout View to my application?
http://marionettejs.com/docs/marionette.application.html#application-regions
Application Regions
Warning: deprecated This feature is deprecated. Instead of using the Application as the root of your view tree, you should use a Layout View. To scope your Layout View to the entire document, you could set its el to 'body'. This might look something like the following:
var RootView = Marionette.LayoutView.extend({ el: 'body' });
I will like to explain with a very simple example the usage of layout view in marionette.
html
   <div id="appDiv"></div>
   <script type="text/template" id="mainTemplate">
       <div id="div1"></div>
       <div id="div2"></div>    
   </script>
    <script type="text/template" id="itemTempFirst">
       <p>some text item 1 view</p>
       <p>some text item view 1</p>
    </script>
     <script type="text/template" id="itemTempSecond">
       <p>some text item 2 view</p>
       <p>some text item view 2</p>
     </script>
JS Code:--
     var app = new Marionette.Application();
     var LayoutViewObj = Marionette.LayoutView.extend({
         template:"#mainTemplate",
         el:"#appDiv",
         regions:{
            reg1:"#div1",
            reg2:"#div2"
         }
     });
      var layoutViewInstance = new LayoutViewObj();
      layoutViewInstance.render();
      var ItemView1Obj = Marionette.ItemView.extend({
         template:"#itemTempFirst"
      });
      var ItemView2Obj = Marionette.ItemView.extend({
         template:"#itemTempSecond"
      });
      var item1 = new ItemView1Obj();
      var item2 = new ItemView2Obj();
      layoutViewInstance.getRegion("reg1").show(item1);
      layoutViewInstance.getRegion("reg2").show(item2);
Please note I was trying without el element earlier , but i got no luck and as I used el:"#someElem" life got easier
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With