CODEWITHSUNDEEP
javascriptbackbone.jsmarionette
Jane Sparza
Jane Sparza

Reputation: 1

Collection not displaying on page

I can't make my collection display. I have a REST controller in my backend '/cars' and this JS code at the page

var Cars = Backbone.Collection.extend({
    url: '/cars'
});
var myChildV = Marionette.View.extend({
    template: '#myV',
});
var myCollectionV = Marionette.CollectionView.extend({
    collection: new Cars(),
    childView: myChildV,
});
var collectionV = new myCollectionV();
collectionV.render();

but it displays nothing on page. The template is placed before js is executed and looks like

<script id="myV" type="x-template/underscore">
    <h1><% items.name %></h1>
    <h2><% items.price %></h2>
</script>

I've tried to read some guides, newbie introduction book, but there all providing examples without REST controllers. What should I do to display a collection of models?

Upvotes: 0

Views: 39

Answers (2)

Felix A.
Felix A.

Reputation: 61

Your CollectionView does not know where the rendered content should be appended to. Try adding an "el : 'body'" attribute onto it.

Upvotes: 0

T J
T J

Reputation: 43156

The documentation says:

The CollectionView will loop through all of the models in the specified collection, render each of them using a specified childView, then append the results of the child view's el to the collection view's el.

there are few issues in your code:

  1. Clearly your collection is empty. So there is no model to render. You're neither adding models at client side, nor fetching them from server side

  2. Your view is in memory, it's in no ways connected to actual DOM, if you want to see it in your webpage, you need to append it to the DOM.

Upvotes: 1

Related Questions