선택에 대한 jQuery 유효성 검사가 작동하지 않음

Question

jQuery 유효성 검사 (예 : https://jqueryvalidation.org/)를 사용하면 select와 같이 작동하는 것과 같은 유효성 검사를 수행 할 수 없습니다.

<form id="f"> 
    <div><input type="text" id="a" name="a" class="required"></div> 
    <div> 
    <select id="b" name="b" class="required"> 
     <option value="">Please select...</option> 
     <option value="foo">Foo</option> 
     <option value="bar">Bar</option> 
    </select> 
    </div> 
    <div><input type="text" id="c" name="c" class="required"></div> 
</form> 
<button>Save</button> 

채우기 및 unfocus 다음 unfill 및 unfocus, 텍스트 필드는 오류를 표시하지만 선택하지 않습니다. 모든 필드는 .valid()에서 예상대로 유효합니다. 여기

바이올린 데모 : 당신이 발리 유효한 방법이라고 선택된 옵션을 변경할 때마다 이런 식으로 을 당신이에 전에 오류 메시지가 표시 https://jsfiddle.net/4hq3b0ub/이

Answer 1

당신은 선택 변경 이벤트에 유효한 테스트를 추가 할 수 있습니다 제출하십시오.

코드 조각 :

$("#f").validate(); 
 
$("button").click(function() { 
 
    $("#f").valid(); 
 
}); 
 

 
// 
 
// add the following: 
 
// 
 
$("#b").on('change', function(e) { 
 
    $(this).valid(); 
 
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.1/jquery.validate.js"></script> 
 

 
<form id="f"> 
 
    <div><input type="text" id="a" name="a" class="required"></div> 
 
    <div> 
 
     <select id="b" name="b" class="required"> 
 
      <option value="">Please select...</option> 
 
      <option value="foo">Foo</option> 
 
      <option value="bar">Bar</option> 
 
     </select> 
 
    </div> 
 
    <div><input type="text" id="c" name="c" class="required"></div> 
 
</form> 
 
<button>Save</button>