title: backbone collection fetch doesn't fire reset()
body: <p>This is my view for a collection</p>
  
  <pre><code>var mssg = mssg || {};
  
  mssg.MessagesView = Backbone.View.extend({
  
  el: '#messages',
  
  initialize: function() {
      this.collection.fetch();
      this.collection.bind('reset', this.render, this);
  },
  
  render : function() {
      this.$el.html('');
      this.collection.each(function( item ) {
          this.renderMessage( item );
      }, this );
      return this;
  },
  
  renderMessage : function( item ) {
      var messageView = new mssg.MessageView({
          model : item
      });
      this.$el.append( messageView.render().el );
  }
  
  });
  </code></pre>
  
  <p>this is the collection</p>
  
  <pre><code>var mssg = mssg || {};
  
  mssg.Messages = Backbone.Collection.extend({
      model : mssg.Message,
      url : 'messages'
  });
  </code></pre>
  
  <p>and this is how it is initialized:</p>
  
  <pre><code>var mssg = mssg || {};
  
  $(function() {
      new mssg.MessagesView({
          collection : new mssg.Messages()
      });
  });
  </code></pre>
  
  <p>The problem is that the <code>render</code> function bound to <code>reset</code> doesn't fire after the ajax fetch request.</p>
  
  <p>If I bind it to <code>add</code> it works.
  I tried binding <code>all</code> to a debuggin function and it says that the <code>sync</code> event is called alongside the <code>add</code> for every item.</p>