如何防止 Backbones save 方法尝试更新每个模型？

Question

我正在使用 backbone 创建一个 crud web 应用程序。我正在编写更新资源 (PUT) 的功能。我试图通过从服务器获取模型属性（参见 SubscriberView）并成功获取资源以实例化 SubscriberEditView 来实现这一点，从而传递新获取的模型。到目前为止，这按预期工作； SubscriberEditView 呈现一个 html 表单，其中填充了模型实例属性。当我在表单中输入新的登录值时，我可以触发更新功能，该功能成功地向服务器资源发出 PUT 请求并按预期更新模型实例。但是，问题是当我用另一个模型实例重复这个过程时，PUT 请求是针对当前模型和先前实例化的模型发出的。这是因为我现在有两个 SubscriberEditView 实例吗？还是我有其他东西 missed/misunderstood.

请参阅下面描述的代码。

// The view for a single subscriber
var SubscriberView = Backbone.View.extend({
 tagName: 'tr',
 template: _.template($('#subscribers-tmpl').html()),
 initialize: function() {
  this.listenTo(this.model, 'destroy', this.remove);
 },
 render: function() {  
  var html = this.template(this.model.toJSON());
  this.$el.html(html);
  return this;
 },
    events: {
        'click .remove': 'onRemove',
        'click .edit-subscriber': 'editSubscriber',
    },
    editSubscriber: function() {   
     var getSubscriberModel = this.model.set('id', this.model.attributes.id, {silent:true})
     getSubscriberModel.fetch({
      success: function (model, response) {
       $('#addSubscriber').fadeOut();
       new SubscriberEditView({model:model});     
      },
      error: function (response) {
       console.log('There was an error');
      }
     });
    },
    onRemove: function() {
        this.model.destroy();
    }    
});

// The edit view
var SubscriberEditView = Backbone.View.extend({
 tagName: 'div',
 el: '#updateSubscriber',
 template: _.template($('#subscriberEdit-tmpl').html()),
 initialize: function() {
  this.model.on('sync', this.render, this);
 },
 events: {
  'click #close': 'cancel',
  'click .save-subscriber': 'update'
 },
 update: function() {
  var $login = this.$('#login');
  this.model.save({
   login: $login.val(),
  },
        { 
   dataType: 'text',
   success: function (model, response, options) {
    console.log('success');
     
        },
   error: function (model, response, options) {
    console.log('error');
        }
        });
 },
 cancel: function() {
  $('#addSubscriber').fadeIn();
  $('#editInner').fadeOut();
 },
 render: function() {
  var html = this.template(this.model.toJSON());
  this.$el.html(html);
 }, 
});

如果有人能提供帮助，我们将不胜感激。干杯

Answer 1

问题是el: '#updateSubscriber',。您所有的视图实例都指向委托事件的同一元素。所以点击任何 .save-subscriber 将触发所有视图实例的更新。您不应为将具有多个实例的视图指定 el。

如何防止 Backbones save 方法尝试更新每个模型？

How can I prevent Backbones save method from trying to update every model?

javascript

backbone.js