CODEWITHSUNDEEP
javascriptbackbone.jsmarionette
user3350508
user3350508

Reputation: 123

Getting Marionette layouts to render like backbone view

I'm attempting to get a marionette layout to render like a backbone view. Ie, I've declared a tagName and an id and I want it to generate a dom element based of that. For such a simplistic element, it seems redundant to have to make a template stub just for that.

HTML: 

<body><div id="page"></div></body>

Test code:

var HeaderBar = Backbone.Marionette.Layout.extend({
    tagName: "div",
    id: "headerBar"

});

/*========== APP Tests ============*/
App = Marionette.Application.extend({});

var MyApp = new App();
MyApp.addRegions({
    pageRegion: "#page"
});



var header = new HeaderBar();
MyApp.pageRegion.show(header);

However, calling show from the app throws the TemplateNotFoundError.

I'm looking for a way to have Marionette render this without a template and without having to commandeer the render function in the library.

Upvotes: 0

Views: 149

Answers (2)

Manny Fleurmond
Manny Fleurmond

Reputation: 367

Layouts require a template because they need to render regions inside of them. If you aren't using any regions with your layout, you don't need to use a Layout; use an ItemView instead:

var HeaderBar = Backbone.Marionette.ItemView.extend({
    tagName: "div",
    id: "headerBar"
});

Then use it as normal with your region.

If you do, however, need regions inside HeaderBar, then yes, you need a template with a Layout.

Upvotes: 0

David Sulc
David Sulc

Reputation: 25994

Try with

var HeaderBar = Backbone.Marionette.Layout.extend({
    template: _.template("<div></div>"),
    id: "headerBar"

});

See https://github.com/marionettejs/backbone.marionette/blob/master/docs/marionette.renderer.md#using-pre-compiled-templates

Upvotes: 2

Related Questions