Почему при заполнении input его значение остаётся пустым?

Question

[qfrontend]

Приветствую) Помогите пожалуйста)
Делаю валидацию формы на пустые поля и столкнулась с такой проблемой, что input для ввода телефона остаётся с пустым значением, даже если оно заполнено. Все остальные поля нормально валидируются, но это ..... Его значение остаётся пустым, и из за этого форма не проходит валидацию.
Вывожу в консоль значение заполненного поля а там пустая строка((( В чём может быть дело?

<input type="text" placeholder="+(375) 255-383-464" name="phone" id="commercial-offer__user-phone"/>

let valid = false;
  $(form).submit(function(e){
      e.preventDefault();
      let mail = $('input[name=mail]').val();
      let mailInput = $('input[name=mail]');
      let phone = $('input[name=phone]').val();
      let phoneInput = $('input[name=phone]');
      if(mail == "" && phone == ""){
        onError(valid, mailInput, 'error', 'p.error-text', 'Заполните поле телефон или почта');
        onError(valid, phoneInput, 'error', 'p.error-text', 'Заполните поле телефон или почта');
      } else {
        valid = true;
      };
      console.log(phone); /*Вывод в консоль*/

      if(valid == true ){
        $(form).unbind('submit').submit();
      };
      
    });

Comments

[dollar]

Вы начали отлаживать, это хорошо.
Нужно дальше отлаживать, это и есть поиск ошибки.
Например, наберите что-нибудь в input и тупо в консоли наберите $('input[name=phone]').val()
В зависимости от результата думайте дальше и так далее, пока не локализуете проблему.

[qfrontend]

dollar,
Да, так я тоже делала, но там просто пустая строка ("") и всё, хотя поле заполнено. Ума не приложу куда дальше копать...
Все остальные поля при такой же проверке выводят строку которую ввела в инпут.

[Stalker_RED]

// И не нужно два раза подряд искать элемент в DOM. Вместо этого:
      let mail = $('input[name=mail]').val();
      let mailInput = $('input[name=mail]');
      let phone = $('input[name=phone]').val();
      let phoneInput = $('input[name=phone]');
// Можно сделать так:
      let mailInput = $('input[name=mail]');
      let mail = mailInput.val();
      let phoneInput = $('input[name=phone]');
      let phone = phoneInput.val();

[dollar]

Какой бы ни был результат эксперимента, это шаг на пути к завершению поиска.
Всё равно пустая строка, говорите? Значит, можно исключить вашу функцию и плотнее заняться простым получением значения.
Наша задача, для начала, самым простым способом получить значение, хоть как-то. Предположим, что плохо работает jQuery. Тогда попробуем получить значение на чистом JS:
document.getElementsByName('phone')[0].value
Или так:

document.getElementById('commercial-offer__user-phone').value

[qfrontend]

dollar,
Спасибо :) Вы супер!

Answer 1

[Karpion]

Если с полем "mail" всё нормально - ищите опечатку. Сравните поля ввода для почты и телефона.