Jquery验证依赖字段

Question

Huy Guys，

我正在尝试使用jQuery验证插件，并指定只有当其他3个字段为空（未填充）时才需要一个字段。

问题是该规则正在运行，但即使我在其上键入值，它仍然需要该字段。

感谢。

这是我的代码：

$("#ProspectDtlFrm").validate({
 rules: {

  prsptEmail: {
   required: function(element) { return ( $("#prsptHomePhone").val() == '' && $("#prsptBusinessPhone").val() == '' && $("#prsptMobilePhone").val() =='') }                                         
   }    
 },
 messages: {
      prsptEmail: "Please enter your first name"
 }
}); 

Answer 1

您可以使用depends：

$('#ProspectDtlFrm').validate({ 
    rules: {
        prsptEmail: {
            required: {
                depends: function(element) {
                    return ($('#prsptHomePhone').val() == '' && 
                            $('#prsptBusinessPhone').val() == '' && 
                            $('#prsptMobilePhone').val() == '');
                }
            }
        }    
    }, 
    messages: { 
        prsptEmail: 'Please enter your first name'
    } 
});

Answer 2

仍然支持depends子句。这是1.11.0pre版本：

normalizeRules: function(rules, element) {
  // handle dependency check
  $.each(rules, function(prop, val) {
    // ignore rule when param is explicitly false, eg. required:false
    if (val === false) {
      delete rules[prop];
      return;
    }
    if (val.param || val.depends) {
      var keepRule = true;
      switch (typeof val.depends) {
        case "string":
          keepRule = !!$(val.depends, element.form).length;
          break;
        case "function":
          keepRule = val.depends.call(element, element);
          break;
      }
      if (keepRule) {
        rules[prop] = val.param !== undefined ? val.param : true;
      } else {
        delete rules[prop];
      }
    }
  });

如您所见，您可以在“字符串”和“功能”之间进行选择。所以你可以使用：

rules: {
  input_name_here: {
    required: {
      depends: function(element) {
        return $("#thickBoxId:checked").length;
        //or whatever you need to check
      }
    }
  }
}

或者

rules:{
  input_name_here:{
    required: '#tickBoxId:checked'
  }
}

如果您只需要测试是否存在已检查的内容。

Answer 3

'依赖'似乎不再受支持，并且，他们的文档不是最新的。

因此，如果选中“是”复选框，则验证另一个字段：

rules:{
    'name value of area you want to validate':{
        required: '#tickBoxId:checked'
    }
}

Answer 4

方式是'%\\%'它有效。

depends

Answer 5

有专门针对这种情况的功能：require_from_group方法。

https://jqueryvalidation.org/require_from_group-method

说明：确保组中给定数量的字段完整。

在传递给规则的选项中，提供最少的字段数 在必须完整的组中，以及用于定义 组。然后将此规则应用于组中的所有字段。的 然后至少要提交至少最少数量的表格才能提交表格 完成。

Additional-methods.js文件的一部分

我将示例从文档复制到了以下代码段：

$("#myform").validate({
  rules: {
    mobile_phone: {
      require_from_group: [1, ".phone-group"]
    },
    home_phone: {
      require_from_group: [1, ".phone-group"]
    },
    work_phone: {
      require_from_group: [1, ".phone-group"]
    }
  }
});

<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/additional-methods.min.js"></script>

<form id="myform">
  <label for="mobile_phone">Mobile phone: </label>
  <input class="phone-group" id="mobile_phone" name="mobile_phone">
  <br/>
  <label for="home_phone">Home phone: </label>
  <input class="phone-group" id="home_phone" name="home_phone">
  <br/>
  <label for="work_phone">Work phone: </label>
  <input class="phone-group" id="work_phone" name="work_phone">
</form>