从特定元素中删除jQuery元素验证

时间:2016-11-21 10:15:17

标签: javascript jquery jquery-validate

我的表单的jQuery验证定义如下。

 //#costCalculation is a form id
 $('#costCalculation').validate({

    onsubmit: false, //To prevent validation during form submit
       errorClass: "my-error-class",

    rules: {
        adSizeFull: {
            required: true
        },
        fullAdNo: {
            required: true
        }  
    },
    messages: {

        adSizeFull: "Please select Full adsize",
        fullAdNo: "Please select total Ads(Full)"
    },
    submitHandler: function (form) { // for demo
        //alert('valid form');
        return true;
    }
});

我有一个带有这样的选择框的表单

<div class="row">
         <div class="col-sm-6">
         <div class="form-group">
           <label class="control-label col-xs-4">Ads(Full):</label>
           <div class="col-xs-8">
              <select name="adSizeFull" id="fullads-list" class="form-control" onchange="fullAdSizeChange()">
                 <option value="">--Select--</option>
              </select>
           </div>
         </div>
         </div>
         <div class="col-sm-6">
            <div class="form-group">
             <label class="control-label col-xs-4" for="fullAdNo">#:</label>     
             <div class="col-xs-8">
               <select name="fullAdNo" id="fulladnos-list" class="form-control" onchange="fullAdNoChange()">
                 <option value="">--Select--</option>
               </select>
             </div>
         </div>
         </div>
        </div>

我想在以下场景JS

中删除验证
function fullAdSizeChange() {
  var adSizeFull = $("#fullads-list").val();
  var fullAdNo = $("#fulladnos-list").val();
    if(adSizeFull == "" && fullAdNo == "") {
            $("#fullads-list").rules("remove", "required");
            $("#fulladnos-list").rules("remove", "required");  
        }
}

如果表格如上所述,如何从特定元素中删除验证?

我没有复制整个代码。语法可能存在问题。我只需要指南来实现这个

2 个答案:

答案 0 :(得分:1)

jQuery Validate实际上直接支持dependency expressions

您需要做的就是更改您的验证选项:

parent: {
  required: function(element) {
    return $("#age").val() < 13;
    // Makes "parent" required only if age is below 13.
  }

完整示例:

$( "#myform" ).validate({
  rules: {
    age: {
      required: true,
      min: 3
    },
    parent: {
      required: function(element) {
        return $("#age").val() < 13;
      }
    }
  }
});
}

答案 1 :(得分:0)

只需在两个选择框类中添加所需的类,无需添加更改事件

          <select name="adSizeFull" id="fullads-list" class="form-control required" onchange="fullAdSizeChange()">
             <option value="">--Select--</option>
          </select>