jquery 验证具有多个 if/else 条件的规则

Question

我想对 2 个交叉字段使用 jquery validate() 规则。如果在其中一个字段中输入了另一个字段，那么另一个字段也是必需的。此外，一旦需要它们，数字字段的格式应为前 15 位数字应为整数，日期字段应为 mm/dd/yyyy 格式，日期应小于今天的日期。

//..

    $("#adjustmentsFormID").validate({
    rules: {            
    refTranNbr: "required",
    refTranDate: "required"
    },
        messages: {         
            refTranNbr: {
                required: function (element) {
                    if($("#refTranDate").val().length > 0){
                        return "Please enter the reference transaction number ";
                    } else if(!refNumChk($("#refTranNbr").val())){
                         return "Please enter a valid Reference Transaction Number";                    
                    } else {
                        return false;
                    }
                }
            },          
            refTranDate: {
                required : function (element) {
                    var tdate = $("#refTranDate").val();
                    if($("#refTranNbr").val().length > 0){                      
                        return "Please enter a date for the Refering Transaction to complete this transaction.";
                    }else if((new Date() > new Date(tdate))) {
                        return "Please enter a reference transaction date less than today's date.";
                    }else{
                        return false;
                    }

                }
        }, 
    }); 


..//

在这两种情况下，必填字段的第一个条件都有效。但是，对于 refNum 字段，具有 refNumChk 的第二个条件不起作用。实际上它没有被调用。同样对于 refTranDate 所需的字段验证有效但是 date > tDate 没有被检查。不确定这种方法是否有效，或者我应该针对多种情况做一些不同的事情。

Answer 1

您的 jQuery 验证方法是错误的，messages 仅用于 return 验证错误时的错误消息。

所以你所做的唯一验证是必需的验证，你可以添加自定义验证规则来解决这个问题

jQuery(function($) {
  jQuery.validator.addMethod("refNumChk", function(value, element, params) {
    return this.optional(element) || /^\d{15}[A-Z]$/.test(value);
  }, jQuery.validator.format("Enter a value in forat aa-999"));
  jQuery.validator.addMethod("lessThanToday", function(value, element, params) {
    return this.optional(element) || new Date() > new Date(value);
  }, jQuery.validator.format("Value should be less than today"));


  $("#adjustmentsFormID").validate({
    rules: {
      refTranNbr: {
        required: true,
        //refNumChk: true
        pattern: /^\d{15}[A-Z]$/
      },
      refTranDate: {
        required: true,
        lessThanToday: true
      }
    },
    messages: {
      refTranNbr: {
        required: "Please enter the reference transaction number",
        pattern: "Please enter a valid Reference Transaction Number"

      },
      refTranDate: {
        required: "Please enter a date for the Refering Transaction to complete this transaction.",
        lessThanToday: "Please enter a reference transaction date less than today's date."
      },
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.13.1/jquery.validate.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.13.1/additional-methods.js"></script>
<form id="adjustmentsFormID" method="post" action="">
  <div>
    <input name="refTranNbr" />
  </div>
  <div>
    <input name="refTranDate" />
  </div>

  <input type="submit" value="Save" />
</form>

jquery 验证具有多个 if/else 条件的规则

jquery validate rules with multiple if/else condition

javascript

ajax

jquery

jsp

jquery-validate