主干提交表单验证

Question

我在Backbone验证方面有几个问题，但似乎我找到了正确的方法。我已成功地实现以下目标：

var EditUser = Backbone.View.extend({ 
el:'.page', 
validates:function(evt){ 
    console.log('here'); 
    var $field = $(evt.currentTarget); 
    if($field.val() === ''){ 
     $field.css('border', '1px solid red'); 
     return false; 
    } 
    else{ 
     $field.css('border', '1px solid #ccc'); 
    } 
}, 
render: function(options){ 
    var that = this; 
    if(options.id){ 
     that.user = new User({id: options.id}); 
     that.user.fetch({ 
      success: function(user){ 
       var template = _.template($('#edit-user-template').html(), {user:user}); 
       that.$el.html(template); 
      } 
     }); 
    } else{ 
     var template = _.template($('#edit-user-template').html(), {user:null}); 
     this.$el.html(template); 
    } 
}, 
events: { 
    'keyup input[name=firstname], input[name=lastname], input[name=age]': 'validates', 
    'submit .edit-user-form': 'saveUser', 
    'click .delete': 'deleteUser' 
}, 
saveUser: function (ev){ 
    this.$('input[type=text]').each(function() { 
     $(this).trigger('keyup'); 
    }); 
    var userDeatils = $(ev.currentTarget).serializeObject(); 
    var user = new User({validate:true}); 
    user.save(userDeatils,{ 
     success: function(user){ 
      router.navigate('', {trigger:true}); 
     } 
    }) 
    return false; 
}, 
deleteUser: function(ev){ 
    this.user.destroy({ 
     success: function(){ 
      router.navigate('', {trigger:true}); 
     } 
    }); 
    return false; 
} 
}); 

一切正常，当我在输入字段开始打字，但是我需要同样的动作，当我提交表单的情况发生。 （已连接了一个saveUser）。我需要找到一种运行验证蚂蚁的方法，在“saveUser”被调用之前停止提交空白细节的表单。

Answer 1

更改validates如下所示。

validates:function(evt, $field){ 
    var valid = true; 

    if(evt) 
     $field = $(evt.currentTarget); 

    if($field.val() === ''){ 
     $field.css('border', '1px solid red'); 
     valid = false; 
    } 
    else{ 
     $field.css('border', '1px solid #ccc'); 
    } 

    return valid; 
} 

和saveUser如下所示。

saveUser: function (ev){ 
    var valid = true, that = this; 

    this.$('input[type=text]').each(function() { 
     valid = that.validates(null, $(this)); // validate input. 
     if (!valid) return false; //break out from loop. 
    }); 

    if (valid) { 
     var userDeatils = $(ev.currentTarget).serializeObject(); 
     var user = new User({validate:true}); 
     user.save(userDeatils,{ 
      success: function(user){ 
       router.navigate('', {trigger:true}); 
      } 
     });   
    } 

    return false; 
}