jQuery 유효성 검사, div 클릭시 유효성 검사를위한 추가 필드 추가

Question

특정 div 또는 텍스트를 클릭 할 때 유효성을 검사 할 필드를 추가하고 싶습니다. 다음은 시나리오입니다. jQuery 유효성 검사를 사용하여 유효성이 검사 된 양식이 있습니다. 사용자가 "암호 변경"을 클릭 할 때 유효성을 검사하기 위해 유효성 검사에 포함하지 않은 두 필드가 있습니다. 본문. 런타임 중에 유효성을 검사 할 필드를 추가하고 추가 할 수 있습니까?

<span class="change-password">Change Password</span> 

$(document).ready(function() { 
$("#update_user").validate({ 

     rules: { 
      "admin_account[name]": { 
      required: true 
      }, 
      "admin_account[email]": { 
      required: true 
      }, 
      "admin_account[gender]":{ 
      required: true 
      }, 
      "admin_account[nationality]":{ 
      required: true 
      }, 
      "admin_account[photo]":{ 
      accept: false 
      }, 
      "admin_account[date_of_birth(1i)]":{ 
      required: true 
      }, 
      "admin_account[date_of_birth(2i)]":{ 
      required: true 
      }, 
      "admin_account[date_of_birth(3i)]":{ 
      required: true 
      } 
     }, 
     errorPlacement: function(){ 
      return false; // suppresses error message text 
     } 

     }); 

//I want to trigger here an additional validation for the password field 
$(".change-password").on("click", function(){ 
    $("#update_user").validate({ 

     rules: { 
      "admin_account[name]": { 
      required: true 
      }, 
      "admin_account[email]": { 
      required: true 
      }, 
      "admin_account[password]":{ 
      required: true 
      }, 
      "admin_account[password_confirmation]":{ 
      required: true, 
      equalTo:"#edit_registerPassword" 
      }, 
      "admin_account[gender]":{ 
      required: true 
      }, 
      "admin_account[nationality]":{ 
      required: true 
      }, 
      "admin_account[photo]":{ 
      accept: false 
      }, 
      "admin_account[date_of_birth(1i)]":{ 
      required: true 
      }, 
      "admin_account[date_of_birth(2i)]":{ 
      required: true 
      }, 
      "admin_account[date_of_birth(3i)]":{ 
      required: true 
      } 
     }, 
     errorPlacement: function(){ 
      return false; // suppresses error message text 
     } 

     }); 
}); 

Answer 1

jQuery 유효성 검사에는 지정된 요소가 유효성 검사 프로세스에서 제외되는 ignore 속성이 있습니다. 기본적으로 값은 :hidden으로 설정되며 원하는대로 정확하게 수행됩니다. 즉, 숨겨진 요소는 제외됩니다. 첫 번째 validate 호출에서 규칙을 정의하고 두 번째 validate 함수를 제거하면됩니다.