Оповещение JavaScript не работает - PullRequest
Новая
       11

Оповещение JavaScript не работает

0 голосов
/ 04 мая 2018

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

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

var uName=document.getElementByName('userName');
var pword=document.gelElementByName('password');
var verify=document.getElementByName('passwordVerify');
var fName=document.getElementByName('firstName');
var lName=document.getElementByName('lastName');
var field=[uName,pword,verify,fName,lName];

function validateForm(form) {
  for(var i = 0; i < form.field.length; i++){
    if(form.field[i].value.length == 0){
       alert(form.field[i].name+' is required. Please populate');
       form.field[i].focus();
       return false;
    }
   } return true;
}

Не уверен, что я сделал неправильно или в чем причина ошибки. Любая помощь с благодарностью.

1 Ответ

0 голосов
/ 04 мая 2018 

function validateForm() {
  var uName = document.getElementById('userName');
  var pword = document.getElementById('password');
  var verify = document.getElementById('passwordVerify');
  var fName = document.getElementById('firstName');
  var lName = document.getElementById('lastName');
  var field = [uName, pword, verify, fName, lName];

  for (var i = 0; i < field.length; i++) {
    if (!field[i].value) {
      alert(field[i].name + ' is required. Please populate');
      field[i].focus();
      return false;
    }
  }
  return true;
}
<form>
  <input type="text" id="userName" name="userName" /><br/>
  <input type="text" id="password" name="password" /><br/>
  <input type="text" id="passwordVerify" name="passwordVerify" /><br/>
  <input type="text" id="firstName" name="firstName" /><br/>
  <input type="text" id="lastName" name="lastName" /><br/>
  <button onclick="validateForm();">Submit</button>
</form>

Теперь вот изменения, которые я сделал:

Я изменил getElementByName на getElementById по всему коду, для простоты; Я удалил параметр функции и изменил form.field на field, потому что ... Ну, первый был просто неправильным.

Я также изменил итеративный тест на !field[i].value, что эквивалентно тестированию, если значение имеет длину, но мне показалось более подходящим.

Это все, что я сделал, добавив идентификаторы к элементам формы.

P.S .: Это мой первый подробный ответ здесь, обратная связь будет принята с благодарностью! :)

...