backbone.js - How to properly use Marionette layouts? -
my current code looks this:
define([ 'jquery', 'underscore', 'backbone', 'marionette', 'templates', 'gridview', 'detailview', 'detailmodel' ], function ($, _, backbone, marionette, jst, gridview, detailview, detailmodel) { 'use strict'; return marionette.layout.extend({ el: '#main', template: jst['app/scripts/templates/main.ejs'], initialize: function() { this.render(); }, onrender: function () { var layout = marionette.layout.extend({ el: 'div', template: _.template(""), regions: { grid: '#grid', detail: '#detail' } }); this.layout = new layout(); this.layout.render(); }, showgrid: function () { var detailmodel = new detailmodel(); var g = new gridview(detailmodel); var d = new detailview(detailmodel); this.layout.grid.show(g); this.layout.detail.show(d); } }); });
what not understand why need layout in onrender method make work. '#grid' , '#detail' divs part of main.ejs template, following not work:
return marionette.layout.extend({ el: '#main', template: jst['app/scripts/templates/main.ejs'], regions: { grid: '#grid', detail: '#detail' }, initialize: function() { this.render(); }, onrender: function () { var detailmodel = new detailmodel(); var g = new gridview(detailmodel); var d = new detailview(detailmodel); this.grid.show(g); this.detail.show(d); } });
it seems layout works if elements specified in region object exist when layout created. documentation says not case.
i'm doing wrong. ?
regards roger
in second code example, try using onshow
instead of onrender
.
in addition, in marionette don't call render
yourself, since framework call method when pass view/layouts show
method.
you can see different take on you're trying accomplish here :
Comments
Post a Comment