Rails 5 - form.select 上的 jQuery 验证仅在提交后有效

Question

我有一个需要验证的下拉菜单，但它的行为不像我预期的那样。

# app/views/forms/_form.html.erb

<%= form.select :environment, [ 'Production', 'Staging', 'Test' ],
{ prompt: 'Select an Environment' }, { required: true } %>


# app/assets/javascripts/forms.js
$('form#new_form').validate({
  validClass: "valid",
  errorClass: "invalid",
    rules: {
      'form[environment]': { required: true },
    }
});

重现步骤：

1. 点击下拉菜单
2. 选择一个选项；生产、暂存或测试
3. valid 类被添加到下拉列表中
4. -- 这就是问题所在--点击下拉列表中的返回并选择提示Select an Environment。
5. invalid 类不会添加到下拉列表中。

上述步骤只有在我提交表单并注意错误时才能正常工作。然后，当我重复步骤 1-5 时，当我选择一个选项（生产、暂存或测试）时会添加 valid 类，当我选择提示 Select an Environment 时会添加 invalid 类

Answer 1

根据文档 (https://jqueryvalidation.org/documentation/)，它的行为符合预期。

在字段被标记为无效之前，验证是惰性的：之前 第一次提交表单，用户可以tab通过 字段不会收到烦人的消息——它们不会被窃听 在有机会实际输入正确值之前

一旦一个字段被标记为无效，它就会被急切地验证：只要 用户输入了必要的值，错误信息被删除