Почему не срабатывает валидация?

Question

[Vitaly Max]

Здравствуйте!
Есть форма

<form action="#" method="POST" id="feedback-form" class="feedback-form">
				<div class="feedback-form__item">
					<span class="feedback-num">1</span><span class="feedback-option">Фамилия и имя</span>
					<input type="text" name="username" class="feedback-input" placeholder="Сидоров Александр" >
				</div>
				<div class="feedback-form__item">
					<span class="feedback-num">2</span><span class="feedback-option">Электронная почта</span>
					<input type="email" name="email" class="feedback-input" placeholder="[e-mail]" >
				</div>
				<div class="feedback-form__item">
					<span class="feedback-num">3</span><span class="feedback-option">Телефон</span>
					<input type="tel" name="phone" class="feedback-input phone" placeholder="[phone]" >
				</div>
				<div class="feedback-form__item">
					<span class="feedback-num">4</span><span class="feedback-option">Какой деятельностью, не связанной с текущими проектами, вы бы хотели заниматься в рабочее время?</span>
					<textarea type="text" id="textarea" placeholder="Свой проект по созданию универсальной инфраструктуры строительства"></textarea>
				</div>
				<div class="feedback-form__item">
					<button type="submit" id="submit" class="feedback-btn"><span class="feedback-btn__text">Отправить</span></button>
				</div>
			</form>

Есть код валидации этой формы

$('#feedback-form').validate({
		errorClass: "invalid",
		errorElement: "div",
		rules: {
			username: {
				required: true,
				minlength: 2,
				maxlength: 15
			},
			phone: "required",
			email: {
				required: true,
				email: true
			},
		},
		messages: {
			username: {
				minlength: jQuery.validator.format("от 2 до 15 символов"),
				maxlength: jQuery.validator.format("до 15 символов"),
				required: "Заполните поле"
			},
			phone: {
				required: "Заполните поле"
			},
			email: {
				email: "Введите корректный email",
				required: "Заполните поле"
			},
		},
		
	});
	$(".phone").mask("8 [phone]");

Все библиотеки подключены


Песочница Прошу прощения
https://jsfiddle.net/RaggaMaffin/1zhcpsug/3/

Comments

[Максим Тимофеев]

вариантов масса. Дублирование скриптов, работа сторонних скриптов мешает этому и еще 2 вагона вариантов. Вы бы код в песочницу кинули, что бы проверить. В консоле ошибки есть?

[Vitaly Max]

Максим Тимофеев, добавил, ошибки есть в консоли, разбираюсь.. можешь глянуть? https://jsfiddle.net/RaggaMaffin/1zhcpsug/3/

[Максим Тимофеев]

RaggaMaffin, так в консоле есть же все ответы. Ошибка:

Uncaught SyntaxError: Unexpected string

на строке:

},
	/////////////////  маска телефона   /////////////////
	$(".phone").mask("8 [phone]");
});

Что это за дичь? Это явно не тот код, что Вы в вопросе указали.

[Vitaly Max]

Так я и не разобрался.. пробовал подключать по очереди.. на другом сайте все работает

[Vitaly Max]

Максим Тимофеев, о чем эта ошибка говорит?

[Максим Тимофеев]

RaggaMaffin,

о чем эта ошибка говорит?

о том, что Вы код вставили куда попало. В данном случае код инициализации маски.

[Vitaly Max]

Максим Тимофеев, Дело в чем то еще.. я оставлял только один скрипт, но все равно. Когда я только подключаю библиотеку в теге страницы, в консоли сразу появляется ошибка. Перепробовал их подключать по очереди.

[Vitaly Max]

Проблему решил так: заново подключил все скрипты и ошибки исчезли. VSCode странный бывает.

Answer 1

[Андрей]

потому что обработчик сабмита на onSubmit тега формы надо вешать и там уже валидацию производить