Реализация Scroll to Element после AJAX сабмита формы
Данное решение у меня родилось, когда столкнулся с задачей добавления плавного Scroll'a к началу формы после после AJAX сабмита. Проект, для которого делался данный таск, был откровенным "амном", поэтому реализовывать через Drupal AJAX сommands не было никакого смысла. Если более подробно о форме, то это была Webform с примотанным модулем Webform Ajax (тоже его недолюбливаю).
Решил попробовать обойтись чистым JS кодом, несмотря на то, то форма содержала элемент загрузки файлы — это еще один AJAX какбэ. В результате получилось вот такое компактное решение:
- (function ($) {
- Drupal.behaviors.MyModuleScroll = {
- attach: function (context, settings) {
- // Scroll to the top of a Webform after a submit.
- if (typeof $(context).attr('id') == "string" && $(context).attr('id').startsWith('webform-ajax-wrapper-330')) {
- $('html, body').animate({ scrollTop: $('h1').offset().top - 50 }, 500);
- }
- }
- };
- })(jQuery);
Вся проблема тут заключается в том, чтобы разобраться с переменной
, дабы реагировать только на сабмит всей формы, а остальные AJAX'ы игнорировать. Быстро, удобно и без заморочек с Drupal AJAX commands.context
Комментарии
Спасибо! То что нужно..
Добавить комментарий