2

I am getting stuck on a pretty annoying issue and decided to look for help as the error is hard to figure out.

I have a Marionette Layout view in a single page application representing the panel that switches out. I have it working fine until I try to add a CollectionView as a child of the layout. I am doing something wrong but the error I get is not very helpful.

I am getting this error:

Uncaught TypeError: undefined is not a function backbone.marionette.js:1240
Marionette.CollectionView.Marionette.View.extend._initChildViewStorage backbone.marionette.js:1240
Marionette.CollectionView.Marionette.View.extend.constructor backbone.marionette.js:1014
child backbone.js:1531
Marionette.Layout.extend.initialize

I can't figure out what function I need to define in this case.

Here is my 'page' Layout (as it sits in the require wrapper)

    return Marionette.Layout.extend({
        template: Template,
        className: "page",

        initialize: function(options) {
            this.collection = new DataSet();
            this.collection.fetch();                                        

            // ADD THE VIEW
            var dataview = new DrinkCollectionView( { collection:this.collection } );

            // SHOW THE VIEW
            this.content.show( dataview );

        },

        regions: {
            content: "#page-content"
        },

    });

This is my CollectionView I am trying to use. I've boiled it down to the bare minimum to try to get this to work with no luck.

    return Marionette.CollectionView.extend({
        collection: MyDataSet,
        itemView: MyItemView,
    });

I assume that I am doing something wrong with creating things in the init method but I am not sure what is the right way to do this.

Any help would be greatly appreciated.

Thanks, G

renderbox
  • 1,595
  • 14
  • 25

2 Answers2

0

How mu is too short said, is hard to say whats going on here. Anyway try to look if you define vars like Template before then you define Marionette.Layout, same on Marionette.CollectionView

Richard
  • 157
  • 1
  • 1
  • 8
0

Two things that I see:

1) Not really sure about your use-case of returning 'Marionette.Layout.extend' Assume that you will create an object using 'new' later? Meaning that you should have the equivalent of

var MyLayout = Marionette.Layout.extend {...}
var _myLayout = new MyLayout ();

2) The region should be rendered inside 'onRender' instead:

onRender: function() {
  // SHOW THE VIEW
  this.content.show( new DrinkCollectionView( { collection:this.collection } ) );

}
Ming Chan
  • 1,938
  • 11
  • 21