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

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. -这就是问题出现-点击后面的下拉列表中，选择提示选择环境。
5. 该invalid类不被添加到下拉。

当我提交表单并注意错误时，上述步骤仅按预期工作。 然后，当我重复步骤 1-5 时，当我选择一个选项（生产、暂存或测试）时会添加valid类，而当我选择提示选择环境时会添加invalid类

Answer 1

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

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

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