Marionette 2.4.1 Can't Create CollectionView Instance

Question

I'm having trouble creating an instance of a CollectionView in Marionette 2.4.1. This is a really simple example. Not sure what's going on. Seems like a Marionette bug.

var AppointmentModel = Backbone.Model.extend({
});

var AppointmentCollection = Backbone.Collection.extend({
  model: AppointmentModel
});

var TimeSlotView = Marionette.ItemView.extend({
});

var AppointmentCollectionView = Marionette.CollectionView.extend({
  childView: TimeSlotView
});

Here is the template:

<script id="time-slot-template" type="text/template">
  <div class="col-xs-4">
    <button class="btn-time-slot" data-appointment-time="<%= date %>">
      <%= date %>
    </button>
  </div>
</script>

The main code:

//...inside ajax success

// result looks like this:
// [ "2015-1-2", "2015-1-17", "2015-2-1", "2015-2-8" ]

var appointmentCollection = new AppointmentCollection(result.map(function(apt){
  return new AppointmentModel({ date: apt });
})); //browser console shows a good valid collection

var appointmentCollectionView = new AppointmentCollectionView({ collection: appointmentCollection });
// Undefined is not a function

What am I doing wrong?

Answer 1

Doesn't look like there's anything wrong with the code you posted.

Can confirm it works fine for me...http://jsfiddle.net/nuewwdmr/

The only change i made was to include the idAttribute in the model but that wouldn't effect this issue you're having.

var AppointmentModel = Backbone.Model.extend({
    idAttribute: 'date'
});

The only thing I can think of is that Marionette has dependencies on Babysitter and Wreqr (as well as underscore, Backbone obviously). Have you included these dependencies?