Как мне сделать валидацию этой формы?

Question

Дмитрий @WafelT

HTML/CSS/JavaScript

JavaScript

Как мне сделать валидацию этой формы?

<form class="modal-form validate-form" id="validate-form" action="#">
      <input class="g-input modal-form__input" data-validate-field="name" type="name" name="Имя" placeholder="Ваше имя" inputmode="text">
      <input class="g-input modal-form__input" data-validate-field="tel" type="tel" name="Телефон" placeholder="Ваш телефон" inputmode="text">
      <button class="btn-reset g-btn modal-form__btn">Вызвать</button>
</form>

Есть такая форма, нужно сделать её валидацию какой плагин для этого можно использовать, важно чтобь в нём был параметр при ошибки формы, чтобы можно было добавить классы при ошибки формы.

Вопрос задан более трёх лет назад
97 просмотров

Комментировать

Подписаться 1 Простой Комментировать

Answer 1 · 2022-01-03 15:18:06

Это называется «угадайте, plugin для чего имел в виду автор».
По существу — без всяких plugins помогут HTML-атрибуты pattern и required. В pattern нужно прописать регулярное выражение для проверки. А чтобы менять класс формы, нужно навесить на inputы обработчики события invalid. То есть получится что-то вроде:

<input class="g-input modal-form__input" data-validate-field="tel" type="tel" name="Телефон" placeholder="Ваш телефон" inputmode="text" required pattern="+[0-9]{10,12}" oninvalid="this.form.classList.add('error-class')">

Как мне сделать валидацию этой формы?

Войдите на сайт