Question

我有一张表格：

<form>
    <input type="text" name="email" >
    <input type="text" name="phone" >
    <input type="button" value="ok" />
</form>

单击按钮时，我想将表单值复制到相应的模型中。

我发现Backbone.ModelBinder会在值发生变化时自动将值复制到模型中，但这不是我想要的，我只想在单击按钮时复制值。

Answer 1

将自定义函数写入表单所在的视图中，并将其绑定到ok click事件：

events: {
  ...
  'click input[name="ok"]': 'copyFormToModel'
  ...
},

...

copyFormToModel: function() {
  var email = $('input[name="email"]').val();
  var phone = $('input[name="phone"]').val();

  // Perform some sort of validation

  this.model.email = email;
  this.model.phone = phone;
}

这不是最漂亮的答案，但如果你的页面只有一个小表单，那么使用一些库或插件可能有点矫枉过正。如果你想使用插件或库，那么对于你的情况，我认为backbone-forms可以做到这一点。它的功能是使用方法调用更新绑定到表单的模型，而不是每次更新字段。

Answer 2

您可能需要此代码：

events: {
  ...
  'click input[value="ok"]': 'collectData2Model'
  ...
},

...
//suppose employee is your model
collectData2Model: function(e) {
    var employee = new Employee();
    var attr = {};
     $('input').each(function(){
            var input = $(this);
            attr[input.attr('name')] = input.val();
      });
       employee.bind('error',function(model,error){
            alert(error);
        });
      // set method will automatically call the model's validate method 
       employee.set(attr);
}

将表单复制到Backbone.js模型

2 个答案: