JQuery изменения проверки проверки поля на лету

Question

я использую проверки JQuery и у меня есть код, указанный выше

<script language="javascript"> 

$(document).ready(function() { 


    var validator=$("form#myForm") 
     .validate({ 
      submitHandler: function(form){ 
      alert("Submited"); 
      }, 
      invalidHandler: function(form, validator) { 
       var errors = validator.numberOfInvalids(); 
       if (errors) { 
        console.log(validator.invalidElements()); 
       } 
       }, 
      rules: { 
         field1: { required: true }    
        } 
    });  

}) 

function changeValidation() 
{ 
     var validationType=$("#nextFieldValidation").val(); 

     console.log("selected validation type is "+validationType); 

     switch(validationType) 
     { 
      case "integer": 
       console.log("set INTEGER validation"); 
       $("#nextField").rules("remove"); 
       $("#nextField").rules("add", { 
         digits: true 
        }); 
      break; 
      case "float": 
       console.log("set FLOAT validation"); 
       $("#nextField").rules("remove"); 
       $("#nextField").rules("add", { 
         number: true 
        }); 
      break; 
      default: 
       console.log("REMOVE validation"); 
       $("#nextField").rules("remove"); 
      break; 
     } 
} 
</script> 


<form id="myForm" name="form" action="action.php"> 
    <div><input type="text" name="field1" id="field1" /></div> 

    <div> 
     <select name="nextFieldValidation" id="nextFieldValidation" onclick="changeValidation();"> 
      <option value="">Select next filed validation</option> 
      <option value="integer">Integer</option> 
      <option value="float">Float</option> 
     </select> 
    </div> 

    <div><input type="text" name="nextField" id="nextField" /></div> 

    <div><input type="submit" /></div> 

</form> 

Проверка nextField управляется с помощью поле выбора. Пользователь определяет, будет ли nextField целочисленным или плавающим.

Код работает нормально, но мне нужно добавить что-то, чтобы увеличить доступность для пользователя.

Итак, вот в чем проблема.

Сценарий:

пользователь заполняет field1 выбрать проверку целочисленного и заполняет 12.8 и нажмите на кнопку отправить Он получает ошибку «Пожалуйста, введите только цифры.» который является правильным

После этого изменить валидацию на поплавок.

В этом проблема. ошибка «Пожалуйста, введите только цифры». все еще существует и его путаница. Вы должны отправить форму для продолжения, но почему кто-то нажимает кнопку «Отправить» при получении ошибки.

Так есть ли способ, при изменении направления выберите значение коробка как-то перепроверить форму или перепроверить только конкретные nextFiled для того, чтобы устранить ошибку

Благодаря

Answer 1

я предлагаю вам изменить вызов «changeValidation() ", чтобы произойти onchange, а не onclick. onclick, вероятно, срабатывает, когда вы нажимаете элемент управления, чтобы придать ему фокус, а не когда вы выбираете другой вариант. В результате, в то время, когда он запускает проверку, он по-прежнему задается как целое число.

Итак, попробуйте изменить:

<select name="nextFieldValidation" id="nextFieldValidation" onclick="changeValidation();"> 

To:

<select name="nextFieldValidation" id="nextFieldValidation" onchange="changeValidation();">