title: backbone collection fetch error
body: <p>I'm trying to fetch a collection from a .json file. Here is my collection code</p>
  
  <pre><code>define(['jquery', 'underscore', 'backbone', 'vent'], function($, _, Backbone, vent) {
  'use strict';
  
      var Wine = Backbone.Model.extend({
          urlRoot: "js/models/wines.json",
          defaults: {
              "id": null,
              "name":  "",
              "grapes":  "",
              "country":  "USA",
              "region":  "California",
              "year":  "",
              "description":  "",
              "picture":  ""
          }
      });
  
      return Backbone.Collection.extend({
          model: Wine,
          url: "js/models/wines.json",
      });
  });
  </code></pre>
  
  <p>I'm fetching the collection like this:</p>
  
  <pre><code>var _wine = new wineCollection();
  _wine.fetch({
      success : function(data) {
          console.log("ON SUCCESS");
          console.log(data);
      },
      error: function(response) {
          console.log("ON ERROR");
          console.log(response);
      }
  });
  </code></pre>
  
  <p>In the console it's always showing the "ON ERROR" message:</p>
  
  <pre><code>ON ERROR
  child
    _byCid: Object
    _byId: Object
    _callbacks: Object
    length: 0
    models: Array[0]
    __proto__: ctor
  </code></pre>
  
  <p>And here is one item of my wines.json file</p>
  
  <pre><code>{"id":"9","name":"BLOCK NINE","year":"2009","grapes":"Pinot Noir","country":"USA","region":"California","description":"With hints of ginger and spice, this wine makes an excellent complement to light appetizer and dessert fare for a holiday gathering.","picture":"block_nine.jpg"}
  </code></pre>
  
  <p>What am I doing wrong?</p>