Вечер добрый.
Вы сделали опечатку в имени класса, поэтому и не сработала
e.prevertDafault.
У формы класс
tel-form, а в js скрипте Вы пытаетесь обработать форму с классом
tel_form.
Ещё Вы не заключили блок if в фигурные скобки, а else в фигурных.
if ( !this.checkValidity() ){
alert('Пожалуйста, заполните обязательные поля.');
}
else {
}
Уберите атрибут
novalidate у формы,
enctype="multipart/form-data"
используйте тогда, когда собираетесь отправлять файлы.
После получения ответа от сервера Вашу страницу перезагрузит всё равно и направит на новый адрес
success: function (data) {
window.location.href = "../спасибо-за-заказ.htm";
},
Думаю, что этот блок лишний, ведь у Вас для поля формы есть атрибут
required и окончательно данные надо проверять на стороне сервера, в Вашем случае в файле
tel_mail.php.
if ( !this.checkValidity() ){
alert('Пожалуйста, заполните обязательные поля.');
}
В общем Ваш код js может быть таким
$(document).ready(function() {
// Добавляем маску для поля с номера телефона
$('.phonemasked').each(function(){
$(this).mask('+7 (999) 999-99-99');
});
$(".tel-form").on('submit', function(e) {
e.preventDefault();
$.ajax({
type: "POST",
url: "/form/tel_mail.php",
data: $( this ).serialize(),
success: function (data) {
window.location.href = "../спасибо-за-заказ.htm";
},
});
// очищаем поля
$('#form-tel').val('');
});
});
И не мешало бы переименовать файл
спасибо-за-заказ.htm, сделать имя латиницей.