CODEWITHSUNDEEP
javascripthtmlbackbone.jshandlebars.jsmarionette
Lorenzo B
Lorenzo B

Reputation: 33428

Not able to render a collection in an Marionette ItemView

I have some problems to render a collection wihin an ItemView. Form Marionette doc (Rendering A Collection In An ItemView) there is written that I can pass a collection to an ItemView and within my template I can just iterate over items like so.

<script id="some-template" type="text/html">
  <ul>
    <% _.each(items, function(item){ %>
    <li> <%= item.someAttribute %> </li>
    <% }); %>
  </ul>
</script>

But in my case it seems not working.

This is the code I'm using.

var report1 = new ReportModel({ name: "David", report:"1" });
var report2 = new ReportModel({ name: "Mark", report:"2" });
var report3 = new ReportModel({ name: "Jack",  report:"3" });

var reportCollection = new ReportCollection( [report1, report2, report3] );

// create the view and inject somewhere, code skipped for brevity here
new CollectView( { model: reportModel, collection: reportCollection } );

The template is enriched by means of Handlebars like so.

{{log items}}

{{#each items}}
<div data-role="drop-class"><span>{{this.name}}</span></div>
{{/each}}

If I log items, undefined is displayed.

The model of the view is used to display other data. My requirements: I need to have an ItemView. No Collection or CompositeView.

Any advice?

Upvotes: 0

Views: 1593

Answers (2)

Xavi
Xavi

Reputation: 603

If you pass both a model and a collection to an ItemView, the items array is not set in the serializeData method called before rendering the view. That's why items is undefined.

To make items available in this case it would be necessary to override the serializeData method appropriately.

(See also the answer for this same issue in Marionette's GitHub.)

Upvotes: 1

MarkKGreenway
MarkKGreenway

Reputation: 8764

The View doesnt need to know the model and the collection.

Try :

// create the view and inject somewhere, code skipped for brevity here
new CollectView( { collection: reportCollection } );

Upvotes: 0

Related Questions