- Ajax компонент после запроса отображается на пустой странице без шаблона. Не срабатывает аякс компонент
- История одного бага
- AJAX — проблемы с JS и CSS компонент
- Компонент в режиме AJAX_MODE внутри шаблона другого компонента
- не срабатывает Ajax запрос
- Почему не работает javascript после ajax получения ответа?
Ajax компонент после запроса отображается на пустой странице без шаблона. Не срабатывает аякс компонент
Если у вас возникли какие либо вопросы которые вы не смогли решить по нашим публикациям самостоятельно,
то ждем ваше обращение в нашей службе тех поддержки.
История одного бага
Сегодня описывал техподдержке один нетривиальный баг в работе компонентов в режиме ajax, да столько понаписал, что появилось желание посвятить этому багу пост во блоге.
Итак. Как известно, любой компонент битрикса гипотетически может работать в режиме ajax — для этого лишь надо в параметрах подключения компонента указать AJAX_MODE => Y. При наличии этой опции система сама подменяет нужные ссылки и сабмиты форм на js-вызовы ( документация ).
При клике по ссылке, ведущей на этот же компонент, серверу отправляется асинхронный запрос через XHR. При отправке же данных из формы передача данных происходит через скрытый iframe. Результат запроса в обоих случаях вставляется через innerHTML и, как следствие, js-скрипты при такой вставке не исполняются. Для обхода этого ограничения в битриксе были разработаны специальные методы для отработки javascript в контексте страницы.
Возвращаемся к проблеме. В 10 версии продукта сабмиты форм отлавливались путём добавления атрибута onsubmit к форме ( bitrix/modules/main/ajax_tools.php ):
И всё было прекрасно вне зависимости от набора данных, возвращаемых аякс-запросом.
В 11 версии обработчик на сабмит стал вешаться не через атрибут onsubmit , а байндингом с помощью addEventListener , т.е. подписка на событие происходит путем вызова js-кода. Вроде бы всё ок и в преобладающем большинстве случаев оно работает. Однако, из-за особенностей реализации выполнения js-кода, передаваемого компонентом в ответе, возможна ситуация, когда байндинг не будет происходить после получения ajax-ответа и всё будет ломаться. Вот в такой ситуации и оказались читатели одного интернет-СМИ.
Пользователь открывает страницу, на которой размещён компонент с формой и включенным аяксом. Система генерирует js-код, который навешивает обработчик сабмита формы:
300 миллисекунд, байндинг сабмита не происходит и следующий сабмит формы идёт уже не аяксом, а обычной перезагрузкой страницы, в итоге пользователь видит вывод компонента на пустой странице (т.к. AJAX_CALL=Y ).
По этой проблеме был создан тикет, но был получен отлуп — «У компонента iblock.element.add.form нет ajax режима работы». Формально всё верно, т.к. галочки соответствующей у компонента действительно нет.
Однако, есть документация по работе компонентов в режиме ajax, которая регламентирует аякс-режим работы любого правильно сделанного компонента. Что ж, не будем ничего доказывать, копаем сами. Возникновения подобной проблемы можно добиться на любом стандартном компоненте с долго отдаваемой фотографией. Сделать это очень просто — втыкаем на страницу комплексный компонент catalog со включённым компонентом фильтра. В шаблон каталога производим вставку картинки:
Отключаем временно показ этой картинки. Открываем каталог (ссылка вырезана цензурой:-)), нажимаем кнопку «Сбросить» в фильтре — каталог нормально отображается. Нажимаем ещё раз — всё ок.
Теперь подключаем картинку, проводим те же самые манипуляции. Нажимаем первый раз «Сбросить» — каталог прогрузился, однако, выскочила js-ошибка вида (копипаст из firebug):
При повторном нажатии на «Сбросить» страница уже перегружается и на ней отображается вывод компонента без шаблона сайта. Как раз то, что нужно — неведомый баг, который я отлавливал на протяжении полутора дней. Просто, быстро, но печально.
Стабильная повторяемость бага достигнута, теперь бы надо его пофиксить. Часик поразмышляв над нарисованными в тетради схемами вызовов всех функций, приводящих к багу, родилось два вариант
Из очевидных решений на ум пришло два:
1. Реализация deferred-обработчиков load+ready для ифрэйма с костылем под обычный xhr.
2. Двухстрочный файлов ядра, позволящий сделать исполнение js-кода, выводимого компонентов, всегда после замены вывода компонента, тем самым решая проблема с асинхронностью. Сурово, но иначе никак. Без копания в ядре нижеприведённый патч вам ничего не скажет, но разобрать проблему и не показать решение было бы подло:-)
| ./bitrix/modules/main/classes/general/component_ajax.php, __prepareScripts(). Исходная строка: setTimeout(‘top.BX.ajax.__runOnload();’, 300); Модифицированная строка: top === self ? setTimeout(‘top.BX.ajax.__runOnload();’, 300) : null; |
./bitrix/js/main/core/core_ajax.js, BX.ajax.submitComponentForm(). Как ни странно, столь развёрнутый разбор проблемы не вызвал никаких возражений со стороны саппорта, поэтому тикет погулял по нескольким ответственным и направился в отдел разработки. Бага признана незначительной, однако надеюсь, что фикс выйдет действительно в ближайших обновлениях системы, а не в далёком и туманном будущем Источник Добрый день! Столкнулся со следующей проблемой: Проблема в том, что, заходя в раздел, я попадаю на компонент bitrix:sale.basket.basket — все отлично. Когда я перехожу на вкладку с bitrix:main.profile, компонент подгружается, но не работают его JS и CSS. Кто подскажет как быть, или может другой способ реализации? Источник Добрый день. Есть очень непонятная проблема. 2. Есть страница со стандартным комплексным компонентом bitrix:catalog Форма отлично работает. Теперь проблема: Должно быть так: Т.е. весь основной контент сайта попадает в header. А теги в которых должен быть контент вставляются куда-нибудь между кодом компонента работающего в режиме AJAX. Кто встречался с таким? Очень прошу помощи. Пробовал такие варианты: Т.е. проблема именно при размещении AJAX компонента в шаблоне другого компонента. Источник Помощь в написании контрольных, курсовых и дипломных работ здесь. Почему не срабатывает Ajax запрос? Так тоже страница перегружается Добавлено через 9 минут ТАк, вроде отработал аякс, но теперь PHP не работает вообще и если меняю type на JSON, То вообще ничего не происходит. Ты бы не мог проверить у себя мой код? Может ты увидишь что не так? Вчерашний день прожил без интернета, отвечаю только сегодня. Код главной страницы (! в демостранице — вбил адрес форума по умолчанию, чтобы не вводить вручную при проверках, здесь оставил как было): Не всегда срабатывает ajax метод Источник На странице реализована фильтрация товаров через ajax. Скрипт подключен в head Код отправки ajax запроса и обработка ответа Пробовала строку Как можно решить проблему работы скриптов после отправки ajax запроса? Добрый день. Но более точное и правильное я нашел в сети, чтобы скрипт отрабатывал именно на подгруженных ajax элементах: Решено! JQuery обработчики, такие как hover(), click(), bind(), on() и т.д. обрабатывают элементы только при загрузке. Т.е. у тэга div при нажатии атрибут onClick вызывает эту функции. И тут без разницы, подгружен контент ajax’ом или нет. Надеюсь, кому-то будет полезно 🙂 Почему такой вариант не рассматривается? Я так пользуюсь давно. сам когда-то натыкался на это, но так же быстро решил. оказывается это прям ВОПРОС)) Для извращенцев, вот так ещё можно: Спасибо, по всякому уже пробовал, это помогло! Источник
Исходная строка:
obForm.BXFormCallback = function(d)
Модифицированная строка:
obForm.BXFormCallback = function(d) AJAX — проблемы с JS и CSS компонент
Есть идея реализации странички с использованием AJAX:
На странице размещается вывоз 3х компонент, вводится переменная (допустим $_GET[«show»]), состояние которой и определяет, какой компонент отображать.
Вот идея и заключается в том, чтобы отображать эти компоненты без перезагрузки страницы.
При работе без ajax (т.е. переходе по ссылкам) проблем нет.
У меня есть страница /personal/index.php, ее структура аналогична структуре описаной в этом блоге , только компоненты используются
Если зайти сразу на страницу с профилем /personal/index.php?show=profile, то скрипты и стили работают, но проблема с другими компонентами, загружаемых динамически (остается).
P.S.: ShowHeadStrings()?> и ShowHeadScripts()?> в head’е шаблона сайта есть.
Пробовал вываливать скрипты и стили компонент на страницу, еще до их вызова, т.е. сразу 3х компонент, внезависимости от того, какой потом вызовут.
(скрипты, подгруженные ajax’ом не доступны — почему?)Компонент в режиме AJAX_MODE внутри шаблона другого компонента
По порядку:
1. Есть структура шаблона для примера:
В шаблоне элемента компонента bitrix:catalog.element (template.php) вставлен код компонента добавления результата веб формы bitrix:form.result.new .
При переключении компонента bitrix:form.result.new в режим AJAX. (параметр AJAX_MODE=’Y’) едет верстка!
1. В основном файле шаблона (template.php) компонента bitrix:catalog.element убирал весь код который есть, оставлял только код компонента bitrix:form.result.new. — ПРОБЛЕМА СОХРАНЯЕТСЯ.
2. Вставлял код bitrix:form.result.new в файл element.php комплексного компонента catalog вместо всего что там есть (вместо вызова шаблона элемента) — ПРОБЛЕМА ИСЧЕЗАЕТ.
3. Просто ставил вызов компонента bitrix:form.result.new на чистую страницу с хедером и футтером. — ПРОБЛЕМЫ НЕТ
Нашел похожую тему, там был совет что подобный косяк с версткой может быть если где то в шаблонах компонентов используются отложенные функции. Но в данном случае ничего не нашел.не срабатывает Ajax запрос
Добрый день! Не пойму почему не срабатыват запрос. 7 
Вот точно какая-то мелочь где-то, которую не заметно
Вот, если я ставлю вместо , то не перегружается, но тогда PHP скрипт не срабатывает
Итак, подытожим, Вы желаете чтобы пользователь вводил в поле адрес сайта, отправлял его и в ответ получал содержимое из meta content=»содержимое» . (Правильно понял?) Это содержимое нужно куда — то поместить. Я выбрал блок с
Не всегда срабатывает ajax
Доброго времени суток. Делаю сайт по нахождению оптимального пути по алгоритму Дейкстры.. При.
Здравствуйте, подскажите пожалуйста, почему не всегда срабатывает ajax запрос? Делаю универсальную.Почему не работает javascript после ajax получения ответа?
После получения ответа от сервера и его вставки на страницу перестает работать скрипт с ховер эффектом.
$(«#sectionproducts»).empty().append(content);
заменить на
$(«#sectionproducts»).empty().html(content);
Результат не меняется
Может это конечно и некропост, но все же я хотел написать по поводу 2го пункта, про событие jQuery.on().
Везде написано
Чтобы они реагировали на подгруженный ajax’ом контент, есть несколько решений:
а в скрипте переделать обработчики в функцию.
Вместо:
Если хотите в функции использовать значение $(this), то задайте в атрибуте у функции onClick=»function_name(this);», а в скрипте в функции задайте событие для этого значения
