Доброго времени суток, помогите осеществить проверку поля (телефон на кол-во знаков) Если номер введен корректно то форму отправляем если нет то выводим алерт что заполните телефон.
Форма сама работает, но проверка не срабатывает корректно. Бывает что алерт выводится но после клика (ок) форма потом всеравно отправляется.
Уже дня 2 мудохаюсь с ней, спасибо.
<form action="" id="forma2" class="form-element formGo">
<input type="text" id="login" class="second name-duble-1 form-name-one" name="entry.2053498632" placeholder="Ваше имя" required>
<input type="hidden" id="login" class="second" name="theme" placeholder="" value="Форма - (Урок Английского)" required >
<input type="text" id="testInput" min="17" class="phone-duble-1 form-control phone form-phone form-phone-one" name="entry.1532729351" placeholder="Ваш телефон" required data-inputmask=""mask":"+38(999) 999-9999"" data-mask="">
<input type="submit" class="form-input__button btn submit-btn btn-style-one" value="Отправить" onclick="sendPost1();">
</form>
<script>
$(".phone__input").inputmask({"mask": "+38(999) 999-9999"});
$(document).ready(function () {
$('[data-mask]').inputmask();
})
function sendPost1() {
let input = document.querySelector("#testInput");
let length = input.value.length;
if (length < 17) {
alert(document.querySelector('#testInput').value + ' меньше 17!');
// alert(Введите правильно номер телефона)
}
else {
// alert(document.querySelector('#testInput').value + ' ок!')
$('.formGo').submit(function (e) { // вешаем событие на отправку формы
e.preventDefault(); // выключаем стандартное действие отправки
var form = $(this); // запомним форму в переменной
// добавим небольшую секцию проверки на заполненность
var errors = false; // сначала ошибок нет
form.find('.req').each(function () { // пройдем по каждому полю с классом .req в форме
$(this).removeClass('error'); // сначала уберем у него класс с ошибкой, на случай если он там есть
if ($(this).val() == '') { // если оно пустое
$(this).addClass('error'); // добавим к нему класс с ошибкой
errors = true; // найдена ошибка
}
});
if (errors) return false; // если есть ошибка то больше ничего не делаем
var data = form.serialize(); // сериализуем данные формы в строку для отправки, обратите внимание что атрибуты name у полей полностью сопдают с нэймами у полей самой гугл формы
$.ajax({ // инициализируем аякс
url: "https://docs.google.com/forms/u/0/d/e/1FAIpQLSfxZUHvrZkPUXtppi5hyQGe9tG1KGw1ldUiowxUtG_-2O90Vw/formResponse", // слать надо сюда, строку с буковками надо заменить на вашу, это атрибут action формы
data: data, // данные которые мы сериализовали
type: "POST", // постом
dataType: "xml", // ответ ждем в формате xml
beforeSend: function () { // перед отправкой
form.find('.send__form').attr('disabled'); // отключим кнопку
}
, statusCode: { // после того как пришел ответ от сервера
0: function () { // это успешный случай
form.html('<h4 style="color: #fff;">Спасибо, Ваш заявка отправлена!</h4><p style="color: #fff;">Я вам перезвоню в течении 30-ти минут.</p>'); // сунем в форму сообщение что все ок
}
, 200: function () { // это тоже успешный случай
form.html('<h4 style="color: #fff;">Спасибо, Ваш заявка отправлена!</h4><p style="color: #fff;">Я вам перезвоню в течении 30-ти минут.</p>'); // сунем в форму сообщение что все ок
}
}
});
});
}
}
</script>
