CODEWITHSUNDEEP
javascriptbackbone.jsmarionette
dennismonsewicz
dennismonsewicz

Reputation: 25542

Marionette LayoutView not rendering

Here is my LayoutView:

define(["marionette", "lodash", "text!home/template.html"],
function(Marionette, _, templateHTML) {

    var HomeView = Marionette.LayoutView.extend({

        template: _.template(templateHTML),

        regions: {
            ad: ".adspace",
            products: ".products"
        }

    });

    return HomeView;
});

Here is my app.js:

define(["marionette", "backbone", "router", "home/view"],
function(Marionette, Backbone, Router, HomeView) {
    'use strict';

    var App = new Marionette.Application();

    App.on('start', function() {
        Backbone.history.start();
        new HomeView();
    });

    return App;
});

And here is my router.js

define(["backbone", "home/view"], function(
    Backbone,
    HomeView
){
    'use strict';

    var Router = Backbone.Router.extend({
        routes: {
            "": "index"
        },

        index: function() {
            console.log("HEYEEY");
            return new HomeView().render();
        }
    });

    return new Router();
});

When I try to view the page in the browser, the layoutview isn't rendered. Not sure what I am doing wrong here

Upvotes: 1

Views: 350

Answers (1)

Trace
Trace

Reputation: 18869

Try to either define an el property on the layoutView: 

var HomeView = Marionette.LayoutView.extend({
    el: "#dom-element", 
    template: _.template(templateHTML),

    regions: {
        ad: ".adspace",
        products: ".products"
    }
});

or use a region to show the layoutview: 

var region = new Marionette.Region({"el": "#container"}); 
var layoutView = new HomeView(); 
region.show(layoutView);

This should work because LayoutViews are extended from regular Marionette Itemviews.

Upvotes: 2

Related Questions