Javascript проверка формы не сработала - PullRequest
Новая
       6

Javascript проверка формы не сработала

0 голосов
/ 27 февраля 2020

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

Вот мой код: 

<div class="container">
  <h2>Login form</h2>
  <form action="signin.php" method="POST" onsubmit="return validation();">
    <h3 id='error'></h3>
    <div class="form-group">
      <label>Username:</label>
      <input name="username" type="text" class="form-control" id="userName" placeholder="Enter username">
    </div>
    <div class="form-group">
      <label>Password:</label>
      <input name="password" type="password" class="form-control" id="password" placeholder="Enter password">
    </div>
    <div class="checkbox">
      <label><input type="checkbox" name="remember"> Remember me</label>
    </div>
    <button name="login" type="submit" class="btn btn-default">Submit</button>
  </form>
</div>

function validation(){
    var username = document.getElementById('userName').value;
    var password = document.getElementById('password').value;
    var error = document.getElementById('error');
    if(username === "" || password === ""){
        error.innerHTML="Need to fill both input !!!"
        setTimeout(()=>error.remove(),3000);
        return false;
    }
    return true;
}

Ответы [ 2 ]

2 голосов
/ 27 февраля 2020

Как указано в комментариях, при первой проверке вы удаляете свой error элемент. Это заканчивается хорошо, но с ужасными последствиями. Во время второй проверки document.getElementById('error') даст вам undefined, что приведет к сбою error.innerHTML=, что означает, что функция не возвращает false или предотвращает настройку по умолчанию, поэтому событие submit может продолжаться беспрепятственно.

Вместо удаление error, пусто это (так же, как вы заполнили это нормально). 

setTimeout(() => error.innerHTML = "", 3000);
0 голосов
/ 27 февраля 2020

Возможно, у вас есть ошибка в 

getElementById('user**N**ame')

Должно быть в lowercase - имя пользователя

...