jquery - Jquery検証依存フィールド

Question

ユーザーが少なくとも1つに値を入力する必要がある4つのフィールドがあります。したがって、これらの 4 つのフィールドのそれぞれが、すべてが空の場合にのみ必要になることを検証しようとしています。それ以外の場合は必要ありません。

最初に試してみようと選択した 1 つのフィールドでルールが機能しているように見えますが、値を入力した後も必要なエラーが残ります。

これは私のコードです：

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

score 39 · Accepted Answer

使用できますdepends：

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

score 9 · Accepted Answer

この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'
  }
}

チェックされたものの存在をテストするだけでよい場合。

score 5 · Accepted Answer

'depends' はサポートされていないようで、ドキュメントも最新ではありません。

したがって、「はい」のチェックボックスがオンになっているシナリオでは、別のフィールドを検証します。

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

score 4 · Accepted Answer

方法はdependsそれが動作します。

    rules: {
        prsptEmail: {
            required: {
                depends: function(element){
                    if ($('#id-user').val() == '') {
                        return true;
                    } else {
                        return false;
                    }
                }
            }
        },
    },
    messages: {
        prsptEmail : {
            required : "please signIn!",
        }
    },

jquery - Jquery検証依存フィールド

5 に答える 5

Related

Reference