Intereting Posts
Использование файла за пределами иерархии шаблонов для проверки подлинности в Twitter Заказывать персонализированные сообщения по таксономии, а затем по meta_key Каковы все доступные параметры для query_posts? Параметры api для WordPress не обрабатываются, если я использую ajax Состояние нескольких сообщений Каков наиболее эффективный способ иметь два «блогов» на одном сайте? Задача упорядочивания сообщений с числами для названий численно. Например, 1, 10, 100 Поиск пользовательского поиска не работает? Передавать все пользовательские поля через один и тот же фильтр при последующей загрузке? Есть ли способ проверить, какой файл шаблона загружается, если он не является файлом шаблона страницы? Мне нужно отобразить информацию, связанную с сообщением Проверьте, находится ли страница в определенном меню Две петли в одной функции Как создать определенный пункт меню навигации? Нужна помощь для показа одной и той же страницы на первой странице, страницы с поисковой страницей и портфолио

jQuery Validate: не удается переключить следующую панель на проверку формы

Я боролся с этим вопросом уже более двух дней.

Я пытаюсь внедрить аккордеон Bootstrap для моей проверки WooCommerce. Мне удалось заставить основное гармоничное поведение работать очень хорошо. Но, поскольку я хочу предложить клиентам сложный опыт, я стараюсь сделать эту форму выписки максимально привлекательной (и в то же время удобной для пользователя). Во-первых, мне пришлось использовать jQuery, чтобы убедиться, что значение каждого поля сохраняется через localstorage после выхода из страницы без localstorage формы.

Затем я дезактивировал панели 2 и 3. Идея заключалась в том, чтобы каждый из них постепенно был доступен клиенту. Здесь вы можете увидеть jsfiddle: https://jsfiddle.net/9vjcoLxh/6/

Я также добавил jQuery Validation к форме. В качестве дополнительной заметки панель «login / register» отображается только при выходе из системы. Он не отображается, если пользователь вошел в систему. Вместо этого, если пользователь вошел в систему, следующая панель автоматически переключается, чтобы обеспечить лучший поток проверки. Я хотел проверить ТОЛЬКО вторую панель, так как она содержала фактическую информацию о клиенте (имя и фамилия, адрес электронной почты и т. Д.). Проверка будет инициирована нажатием кнопки, и вот мой фрагмент:

 jQuery('#toggle-delivery').click( function() { jQuery("#validate-info").validate({ rules: { phone_number: { required: true, digits: true, minlength: 9 }, email_address: { required: true, email: true }, shipping_first_name: { required: true, minlength: 2 }, shipping_last_name: { required: true, minlength: 2 } }, onfocusout: function(e) { this.element(e); }, messages: { phone_number: { required: "Please enter a valid UK phone number", digits: "Please enter a valid UK phone number.", minlength: "Please enter at least 9 characters" }, email_address: { required: "We need your email address to contact you.", email: "Oops! This isn't a correct email format. Please check and try again." }, shipping_first_name: { minlength: "Please enter at least 2 characters." }, shipping_last_name: { minlength: "Please enter at least 2 characters." }, shipping_address_1: { required: "Please enter a valid UK address.", minlength: "Please enter a valid UK address." } } }).form(); }); 

Это хорошо работает. Тем не менее, я пошел еще на один шаг и не позволил панели с данными обрушиться, а следующий от расширения, если форма недействительна, добавив этот фрагмент:

 jQuery('#toggle-delivery').click(function(e){ e.preventDefault(); var sectionValid = true; var collapse = jQuery(this).closest('.panel-collapse.collapse'); jQuery.each(collapse.find('input, select, textarea'), function(){ if(!jQuery(this).valid()){ sectionValid = false; } }); if(sectionValid){ collapse.collapse('toggle'); collapse.parents('.panel').next().find('.panel-collapse.collapse').collapse('toggle'); } }); 

Опять же, он работал очень хорошо. Тем не менее, я заметил, что все работает хорошо, только если пользователь вошел в систему. Если нет, форма просто проверяется при нажатии, но активная панель не свертывается +, а следующая не переключается. Это как если бы последний фрагмент не работал – это ОЧЕНЬ странно, потому что он отлично работает, если пользователь вошел в систему.

Я не jQuery / JS savvy, и не совсем эксперт WooCommerce, поэтому я не могу сказать, в чем проблема. Я пробовал много решений, но безрезультатно. Я активировал отладку скрипта, и ничего не появляется. Ошибок в консоли JS тоже нет. Я пробовал это в Chrome и Firefox с теми же результатами.

Я бы очень признателен за некоторые вопросы по возможным вопросам.

Solutions Collecting From Web of "jQuery Validate: не удается переключить следующую панель на проверку формы"