使用 jquery 验证插件验证选择

Question

我有一个默认值为 -1 的 html 选择。

  <select id="BusinessDistrictId">
       <option value="-1">Select one...</option>
       //other options...
  </select>

我想强制用户选择 -1 值以外的任何选项。 我的 jquery 验证规则-

  rules: {
         BusinessDistrictId: { required: true , min:0}
        }

但它不起作用。有什么建议吗？

Answer 1

如果你想用 jQuery Validate 插件来验证这个元素，它的标记有两个问题......

<select id="BusinessDistrictId">
    <option value="-1">Select one...</option>
    //other options...
</select>

1) 根据 jQuery Validate 插件的要求，每个元素都必须有一个唯一的name 属性。在.validate() 中声明规则时，它们由它们的name 标识。但是，无论如何声明规则，每个元素仍必须具有唯一的 name 属性，因为这是插件跟踪表单元素的方式。

2) 您的 min: 0 规则只是针对损坏的 required 规则的解决方法。为了在<select> 元素上使用required: true，您必须在第一个<option> 元素上具有value="" 属性；所以在您的情况下，required 规则将始终被忽略。并且由于您有 min: 0 规则，您将获得类似的验证结果，需要选择一个项目。即使在第一个option 上使用value="" 属性，在select 元素上同时使用required 和min 规则也没有逻辑意义。

这是正确的代码...

HTML：

<select id="BusinessDistrictId" name="BusinessDistrictId">
    <option value="">Select one...</option> <!-- first option contains value="" -->
    //other options...
</select>

jQuery：

rules: {
    BusinessDistrictId: {  // <-- this is the name attribute
        required: true
    }
},

演示：http://jsfiddle.net/y82dV/

Answer 2

添加 name="BusinessDistrictId" 解决了我的问题。