jQuery Validate:如何根据其他字段的值进行验证

jQuery Validate: how do I validate based on other field's value?

本文关键字:验证 字段 其他 Validate 何根 jQuery      更新时间:2023-09-26

我有一个表单。如果选择字段被设置为第一个选项,那么我有两个必须设置的单选组。如果select被设置为任何其他值,则不必设置它们。

选择

:

<div class="field grid_10">
    <label for="severityId" class="grid_3">Severity</label>
    <div class="grid_6"> 
        <form:select id="severityId" path="severityId" items="${severityList}" itemValue="id" itemLabel="title" />
    </div>
    <div class="clear"> </div>
</div>
验证:

 function validate_eventReviewForm() {      
    jQuery('#review-edit-form').validate ({
        rules: {
            sampleWasLost: {required: {
                depends: function(element){
                    return $("#severityId").val() == 1
                }}},
            backupSampleAvail: {
                depends: function(element){
                    return $("#severityId").val() == 1
                }}
        }
    });
}

如您所见,我尝试了两种不同的方法来让jQuery根据需要标记它。

我做错了什么?我该怎么做呢?

问题是你的第二个脚本导致一个错误,导致验证失败

jQuery(function($) {
  $('#review-edit-form').validate({
    rules: {
      sampleWasLost: {
        required: {
          depends: function(element) {
            return $("#severityId").val() == 1
          }
        }
      },
      backupSampleAvail: {
        required: {
          depends: function(element) {
            return $("#severityId").val() == 1
          }
        }
      }
    }
  });
});
<script type="text/javascript" src="//code.jquery.com/jquery-1.11.3.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.13.1/jquery.validate.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.13.1/additional-methods.js"></script>
<form id="review-edit-form" method="post" action="">
  <select name="severityId" id="severityId">
    <option></option>
    <option>1</option>
    <option>2</option>
  </select>
  <br />
  <input type="radio" name="sampleWasLost" value="1" />
  <input type="radio" name="sampleWasLost" value="2" />
  <input type="radio" name="sampleWasLost" value="3" />
  <input type="radio" name="sampleWasLost" value="4" />
  <br />
  <input type="radio" name="backupSampleAvail" value="1" />
  <input type="radio" name="backupSampleAvail" value="2" />
  <input type="radio" name="backupSampleAvail" value="3" />
  <input type="radio" name="backupSampleAvail" value="4" />
  <input type="submit" value="Save" />
</form>