html форма проверки не работает

Я работал над формой html, где мне нужно вводить пользовательскую информацию и отправлять. Он перейдет на страницу подключения php. Проблема в том, что я пытался проверить данные перед отправкой через JavaScript, и это не происходит.html форма проверки не работает

Ниже я публикую HTML-код формы.

<!DOCTYPE html> 
<html> 
<head> 
<script language = "JavaScript"> 
     function validate() 
     { 
      var username = document.getElementById("userName").value; 
      var password = document.getElementById("Password").value; 
      var repassword = document.getElementById("RePassword").value; 

      if (username.length < 0) { 
       alert("Please enter the username."); 
       return false; 
      } 
      if (password == null || password == "") { 
       alert("Please enter the password."); 
       return false; 
      } 
      if (repassword == null || repassword == "" || repassword != password) { 
       alert("Please enter the password."); 
       return false; 
      } 


     } 
</script> 

</head> 
<body> 
<form name="frmMr" action="send_post.php" method="post" onsubmit="return(validate());"> 
    User Name:<br> <input type="text" name="userName"><br> 
    Enter Password:<br> <input type="text" name="Password"><br> 
    Reenter Password:<br> <input type="text" name="RePassword"><br> 
    <input type="submit" > 
</form> 
<p id="error_para" ></p> 
</body> 
</html>

источник

2016-10-03 Animesh Jena

В ваших полях ввода нет идентификаторов, поэтому getElementById возвращает null. – niandrei

Ваш HTML не имеют id тег, в то время как в JavaScript, вы используете getElementById('')

<!DOCTYPE html> 
<html> 
<head> 
// Changed the script syntax 
<script type="text/javascript"> 
    function validate() { 
     var username = document.getElementById("userName").value; 
     var password = document.getElementById("Password").value; 
     var repassword = document.getElementById("RePassword").value; 

     if (username.length <= 0) { 
      alert("Please enter the username."); 
      return false; 
     } 
     if (password == null || password == "") { 
      alert("Please enter the password."); 
      return false; 
     } 
     if (repassword == null || repassword == "" || repassword != password) { 
      // Changed Password message for testing 
      alert("Confirm Password empty or do not match."); 
      return false; 
     } 
    } 
</script> 
</head> 
<body> 
    <form name="frmMr" action="send_post.php" method="post" onsubmit="return(validate());"> 
     User Name:<br> <input type="text" id="userName" name="userName"><br> 
     Enter Password:<br> <input type="text" id="Password" name="Password"><br> 
     Reenter Password:<br> <input type="text" id="RePassword" name="RePassword"><br> 
     <!-- Added id="" attribute to above 3 lines --> 
     <input type="submit" > 
    </form> 
    <p id="error_para" ></p> 
</body> 
</html>

источник

2016-10-03 11:35:48 Aks1357

-2

наконец, return true; в конце вашей функции

источник

2016-10-03 11:22:59 scraaappy

Я уже пробовал это, но тот же результат. –

Это исправление ошибки в его методе, но это не решение его вопроса. – Imaginaroom

Вы забыли добавить IDS для всех Поля

<input type="text" name="userName" id="userName">

и так ...

источник

2016-10-03 11:38:23

Я также предложил бы использовать атрибут required для входов в HTML5.

<input type="text" id="userName" name="userName" required>

Он знаменует собой поле, потребуется (как следует из названия) и форма не будет представить, если нет значения в нем.

источник

2016-10-03 11:50:18 Imaginaroom

Спасибо. Обязательно полезно, но в случае совпадения паролей вы не можете его использовать. Поэтому была выбрана нормальная проверка. –

Ну, думайте об этом таким образом, вам все равно нужно иметь поля для пароля и повторного пароля, поэтому для этого используйте функцию html5. Для их сопоставления вы можете использовать javascript. В веб-разработке всегда рекомендуется внедрять как можно больше уровней безопасности. В этом случае 3, клиентская сторона в html и javascript, а другая на стороне сервера, на всякий случай, когда кто-то найдет способ обойти это. – Imaginaroom

Спасибо. Я добавил их тоже. –

html форма проверки не работает

ответ

Смежные вопросы