主干表单中的实时验证

Question

我正在使用Backbone-Forms，并使用以下模式创建了一个模型：

  schema:
    title:
      type: "Text"
      validators: ["required"]
    description: 
      type: "TextArea"
      validators: ["required"]
    location:
      type: "Text"
      validators: ["required"]

当我尝试提交包含空字段的表单时，验证会正确地进行，并且它们都会收到error类。

但是，当我更新输入以包含内容时，error类不会从我的输入中删除，直到我再次尝试提交表单。同样，如果我最初输入了一个有效的输入，然后删除了所有内容，直到我再次尝试提交表单时，它才会通知我一个错误，而我希望立即知道。

有没有一种方法可以在修改后的输入字段上触发验证？

Answer 1

来自文档：http://backbonejs.org/#Model-validate

isValidmodel.isValid()

如果您以静默方式对模型进行更改，模型可能会进入无效状态...在处理表单输入时很有用。根据您的验证函数，调用model.isValid()检查模型当前是否处于有效状态。

也来自https://github.com/thedersen/backbone.validation#what-gets-validated-when

什么时候会被验证？

如果您使用的是Backbone v0.9.1或更高版本，则将验证模型中的所有属性。但是，如果从未设置过实例名称(显式或使用默认值)，则在设置该属性之前不会对其进行验证。

这在验证已填充的表单时非常有用，因为您不希望警告用户尚未输入的输入中存在错误。

如果您需要验证整个模型(已设置或未设置的两个属性)，您可以在模型上调用validate()或isValid(true)。

Backbone-Forms文档特别提到了model.validate：

https://github.com/powmedia/backbone-forms#model-validation

您可以轻松地将model.Validate连接到您想要的任何编辑事件或单击事件。

此外，您可能会发现这很有用(但不确定它是否与Backbone.Forms兼容)：

https://github.com/thedersen/backbone.validation

Answer 2

使用Backbone-Forms进行“实时验证”的方法是扩展Backbone.Form模型并附加事件来调用自定义方法来验证字段，然后只需“新建”自定义表单而不是Backbone.Form

(Backbone.Form只是Backbone.View的一个子类)

下面是一些示例代码：

    var MyCustomForm = Backbone.Form.extend({
        events: {
            "blur input": "validateRealTime"
        },
        validateRealTime:   function(e){
            if(e.currentTarget.value == "") return;
            var err = this.fields[e.currentTarget.name].validate();
            if(err)
                myDisplayErrorMethod(err.message);
        }
    });

这样做的好处是它将利用您在模型模式中定义的验证器，因此您也可以获得您在模型模式中定义的所有相同的验证和消息(如果您确实定义了自定义消息)。

另外，如果您像我一样定义了几个验证器，那么每次用户在字段中“模糊”时，它都会按顺序调用您的验证器，直到所有验证器都通过为止。所以这是一个加分。

附注，你会注意到我做了if(e.currentTarget.value == "") return;。这只是我的用例，我不想因为用户不断点击而显示错误。