Добрый вечер.
При отправки формы с неправильными данными не срабатывает условие. По идее, если написать в поле данные не по указанному формату, то должно выводить уведомление - "Ошибка ввода данных". Уведомления не происходит, но стиль "bg2" прописывается корректно (происходит подсветка красным цветом). Подскажите, где ошибся?
<form action="success.php" class="contact-form" method="post">
<div class="contact-form__wrap bg-1">
<input type="text" class="tel" name="phone" placeholder="Ваш номер телефона" required>
<button data-submit name="send" class="btn">Подать заявку</button>
</div>
<label class="checkobx-wrap d-flex">
<input type="checkbox" name="check" class="checkbox" required>
<span class="checkbox-custom"></span>
<span class="label">
Согласен на обработку персональных данных <span>и соглашаюсь c политикой конфиденциальности</span>
</span>
</label>
</form>
$('form').submit(function(e) {
e.preventDefault();
var err = false;
var form = $(this);
var phone = form.find('.tel').val();
var reg = /^((\+?7|8)[ \-]?)?((\(\d{3}\))|(\d{3}))?([ \-])?(\d{3}[\- ]?\d{2}[\- ]?\d{2})$/;
if(phone.length < 1) err = 'Это обязательное поле';
else if(!(reg.test(phone))) err = 'Ошибка ввода данных';
if(err) {
form.find('.input-error').html(err);
form.find('.tel').css('box-shadow', 'inset 0 0 0 1px #fd9595');
form.find('.contact-form__wrap').removeClass('bg-1').addClass('bg-2');
return false;
}else {
form.css('opacity', 0);
var load = form.parent('.questions__wrap').children('.loader');
var success = form.parent('.questions__wrap').children('.success');
load.css('opacity', 1);
$.ajax({
type: 'POST',
url: form.attr('action'),
data: form.serialize(),
success: function(){
setTimeout(function() {
form.find('.tel').css('box-shadow', 'inset 0 0 0 1px #b0afaf');
load.css("opacity", 0);
success.animate({opacity: 1}, 200);
setTimeout(function() {
success.css('opacity', 0);
form.get(0).reset();
form.animate({opacity: 1}, 600);
form.find('.contact-form__wrap').removeClass('bg-2').addClass('bg-1');
}, 4000);
}, 1500);
}
});
}
});
Средний
