1

После валидации форма отправляется в любом случае. Где что не так?

Код

<form action="" method="post" name="comment_form">
  <div class="input-group">
    <input type="text" name="first_name" value="" placeholder="Имя">
  </div>
  <div class="input-group">
    <input type="text" name="last_name" value="" placeholder="Фамилия">
  </div>
  <div class="input-group select-wrapper">
    <div class="select-arrow"></div>
    <select name="region_id" id="regions" onchange="get_cities()">
      <option disabled selected>Выберите регион</option>
    </select>
  </div>
  <div class="input-group select-wrapper">
    <div class="select-arrow"></div>
    <select type="text" name="city_id" id="cities" placeholder="Город">
    </select>
  </div>
  <div class="input-group">
    <input type="text" name="phone" value="" placeholder="Телефон">
    <small>в формате: (код города) номер</small>
  </div>
  <div class="input-group">
    <input type="email" name="email" value="" placeholder="Email">
  </div>
  <div class="input-group">
    <textarea name="comment" placeholder="Комментарий"></textarea>
  </div>
  <div class="input-group">
    <button class="button" type="submit">Отправить</button>
  </div>
</form>

Javascript

function validateForm(e) {
  var formElems = this.elements,
    i = 0,
    is_valid = true,
    tmp_valid = true;
  for (; i < formElems.length; i++) {
    var elem = formElems[i];
    if (elem.name == "first_name" || elem.name == "last_name" || elem.name == "comment") {
      if (formElems[i].value.trim() === '') {
        formElems[i].style.borderColor = 'red';
        tmp_valid = false;
        if (is_valid)
          is_valid = tmp_valid;
      }
    } else if (elem.name == 'phone') {
      if (val.trim() != '') {
        var re = /^\(([\d]{3,4})\)\ ([\d\ \-]{6,9})$/;
        if (!val.match(re)) {
          tmp_valid = false;
        }
      }
      if (!tmp_valid)
        is_valid = tmp_valid;
      if (!tmp_valid)
        elem.style.borderColor = 'red';

    }
  }
  if (!is_valid) e.preventDefault();
}
comment_form.addEventListener('submit', validateForm, false);
2
  • Попробуй e.preventDefault(); на return false; заменить
    – Yuri
    19 мар 2017 в 11:16
  • пробовал. не срабатывает. 19 мар 2017 в 11:23

1 ответ 1

2

Вы переменную val нигде не объявили.

6
  • Да. Слеповат стал. Сейчас поправлю. 19 мар 2017 в 11:33
  • @KamoPetrosyan, и функция trim нигде не объявлена..
    – Yuri
    19 мар 2017 в 11:35
  • Все. Сработало. Только с return false все равно отправляется. А e.preventDefault(); прекрасно вписался. 19 мар 2017 в 11:35
  • @KamoPetrosyan, можешь отметить мой ответ, как правильный :-)
    – Yuri
    19 мар 2017 в 11:36
  • .trim() стандартная функция. Убирает пробелы в начале и конце строки. w3schools.com/jsref/jsref_trim_string.asp 19 мар 2017 в 11:39

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.