Javascript Block Form Submission

Question

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

 <form method="post" action="registration.php" autocomplete="off" onsubmit="return validateMyForm();"> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
     <select name="role" id="role"> 
      <option value="Patient">Patient</option> 
      <option value="Doctor">Doctor</option> 
      <option value="Nurse" >Nurse</option> 
     </select> 
     <input type="submit"> 
    </form> 
    <script> 
     $("#role").change(function(){ 
     var val = $(this).val(); 

      switch (val){ 
      case "Doctor": 
       var d = confirm("Are you a doctor?"); 
      } 
     }); 
    </script> 

Answer 1

Чтобы отключить подачу формы вы можете использовать return false на атрибут onsubmit форма.

Поскольку у вас уже есть вызов функции validateMyForm() там, вам просто нужно, чтобы убедиться, что эта функция возвращает ложь:

function validateMyForm() { 
    .... 
    // do some checks... 
    return false; 
} 

Если предотвратить представление формы на основе ответа на ваш confirm, вы должны сохранить ответ в какой-либо переменной, которую можно использовать в дальнейшем:

<script> 
    var d; 
    $("#role").change(function(){ 
    var val = $(this).val(); 

     switch (val){ 
     case "Doctor": 
      d = confirm("Are you a doctor?"); 
     } 
    }); 
</script> 

И внутри функции:

function validateMyForm() { 
    if (!d) { 
     return false; 
    } 
} 

Answer 2

Ваш d переменная будет false, если отменить нажата, так:

$("#role").change(function(){ 
 
    let val = $(this).val(); 
 
    let blockSubmit = false; 
 
    
 
    if (val == 'Doctor') { 
 
     let d = confirm("Are you a doctor?"); 
 
     blockSubmit = !d; 
 
    } 
 
    else { 
 
    blockSubmit = false 
 
    } 
 
    
 
    $('input[type="submit"]').prop('disabled', blockSubmit); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<form method="post" action="registration.php" autocomplete="off" onsubmit="return validateMyForm();"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <select name="role" id="role"> 
 
    <option value="Patient">Patient</option> 
 
    <option value="Doctor">Doctor</option> 
 
    <option value="Nurse">Nurse</option> 
 
    </select> 
 
    <input type="submit"> 
 
</form>