提交在backbone.js視圖中調用多個時間點

Question

我對錶單有一個看法提交我正在調用多個記錄，因此多個記錄被調用。我如何停止接聽多個電話？

第一條記錄得到保存後，當我嘗試保存另一條記錄時，它被保存兩次，然後三次，繼續增加，因爲我繼續添加記錄。

我已經給另一視圖中的事件作爲

事件：{

  "submit" : function(){$('#newWaitlistForm').submit();}, 

}, 

我的表格視圖是

變種的FormView = Backbone.View.extend（{

el: "#newUser", 

template: $.template(null, $('#newUser-tmpl')), 


events: { 
    "submit" : "submit", 

}, 

initialize: function() { 
    this.render(); 
}, 

submit: function(e){ 
    var self = this;  
    console.log('submit'); 
    e.preventDefault(); 
    e.stopPropagation(); 
    var model = new Reservation($('#newWaitlistForm').serializeObject()); 
    var saved = model.save(null, { 
     success: function(data){ 
      console.log({'success': data}); 
      //waitlist.add(data);    
      self.$el.find('input,textarea,select').val('');    
      self.goBack(); 
     },error: function(model, response) { 
      console.log({'error': response}); 
     } 
    }, {wait:true}); 
    console.log({saved: saved}); 
}, 

goBack: function(){ 
    $('.current').removeClass('current'); 
    $('.main').addClass('current'); 
}, 
render: function(){ 
    this.$el.html($.tmpl(this.template,{})); 

    this.$el.find('input[name="phone"]').mask("(999) 999-9999"); 
    var today = Date.parse('now').toString('MM/dd'); 
    return this; 
} 
    }); 

我做錯了什麼事？

Answer 1

這個問題的一個可能的來源是你創建你的骨幹視圖的地方。如果要爲要保存的每條記錄創建新視圖，則需要確保已通過解除所有事件的綁定來正確處理前一視圖。否則，內存中的所有視圖都將獲得提交事件並對其進行處理。這篇文章解釋了這個問題，並提供了一個很好的解決了這個問題：

http://lostechies.com/derickbailey/2011/09/15/zombies-run-managing-page-transitions-in-backbone-apps/

基本想法是讓您的視圖定義了以下功能：

bindTo: function(model, ev, callback) { 
     model.bind(ev, callback, this); 
     return this.bindings.push({ 
     model: model, 
     ev: ev, 
     callback: callback 
     }); 
    }, 
    unbindFromAll: function() { 
     _.each(this.bindings, function(binding) { 
     return binding.model.unbind(binding.ev, binding.callback); 
     }); 
     return this.bindings = []; 
    }, 
    dispose: function() { 
     this.unbindFromAll(); 
     this.unbind(); 
     return this.remove(); 
    } 

你可以把這些功能在視圖基類爲可重用性。

然後，您應該定義一個輔助函數來顯示和新創建的視圖。例如：

showView: function(view) { 
     if (this.currentView) { 
     this.currentView.dispose(); 
     } 
     this.currentView = view; 
     this.currentView.render(); 

    } 

您應該使用bindTo方法將事件綁定到視圖。