я пытаюсь использовать collection.reset () и не получаю ожидаемых результатов в пользовательском интерфейсе. Ответ возвращает 2 результата, что соответствует ожиданиям. Когда я проверяю свою коллекцию, она всегда говорит мне, что у меня есть 2 результата, что тоже правильно.

Тем не менее, в моем html-выводе он просто добавляет в таблицу две новые строки выборки.

initialize: function() {
_.bindAll(this,'buildRows','refreshTable');
    this.template = _.template(maintmpl);
    this.collection = txnList; 
    this.collection.bind("all", this.buildRows, this);
    this.collection.on("reset", this.refreshTable, this);
    this.collection.fetch();
},

events: {
    "click #btn" : "refreshTable"
},
render: function() {
    this.$el.append( this.template() );
},

refreshTable: function() {
    this.collection.reset();
    console.log(this.collection.length)
    this.collection.fetch();
},  

buildRows: function(){
    var mainview = this;

    _(this.collection.models).each(function(model){
        mainview.appendRow(model);
    });
},

appendRow: function(model,i) {
    var row = txnRow(model);
    $('tbody',this.el).append(row.render().el);
}

Итак, изначально я отрисовываю это:

Row1

Стр2

Но с каждым нажатием кнопки, которая вызывает refreshTable, просто добавляется еще 2 строки в таблицу:

Row1

Стр2

Row1

Стр2

Row1

Стр2

Что мне не хватает?