Разбираемся в bitrix ajax


Для начала переведем компонент в режим ajax. Для этого при вызове нужно добавить в параметры компонента несколько пунктов. Поддержка на уровне системы, поэтому можно использовать в своих компонентах

<?
$APPLICATION->IncludeComponent(
	"bitrix:news.list", "", Array(
	"AJAX_MODE" => "Y", // Включить режим AJAX
	"AJAX_OPTION_HISTORY" => "N", // Включить прокрутку к началу компонента
	"AJAX_OPTION_JUMP" => "N", // Включить подгрузку стилей
	"AJAX_OPTION_STYLE" => "Y", // Включить эмуляцию навигации браузера
	// другие настройки компонента
) );
?>

После этого компонент перейдет на ajax работу. И обернет весь шаблон к блок с уникальным id типа comp_8ae7cc8ae0c08e99ce3b922e7а77сc355 — это идентификатор (bxajaxid) компонента с шаблоном и добавка обозначающая контейнер данных. Он к странице и компоненту создания. На других страницах не возможно создать тот же идентификатор.

Теперь для обновления информации можно воспользоваться кодом из битриксной js библиотеки

BX.ajax.insertToNode(
	'/my_page.php'+	// адрес откуда
	'?bxajaxid=8ae7cc8ae0c08e99ce3b922e7а77сc355',	// bxajaxid
	'comp_8ae7cc8ae0c08e99ce3b922e7а77сc355'	// блок куда
); 

Таким образом можно обращаться к компоненту работающему по ajax.

// получение идентификатора
$bxajaxid = CAjax::GetComponentID('bitrix:news.list', '.default');
// получение идентификатора из шаблона компонентна
$bxajaxid = CAjax::GetComponentID(
    $component->__name,
    $component->__template->__name,
    $component->arParams['AJAX_OPTION_ADDITIONAL']
);

При кастомизации дизайна при помощи js средств все рушится при обновлении по ajax. Для запуска после обновления есть метод BX.addCustomEvent
Этот код сработает после аякс-запроса BX.

BX.addCustomEvent('onAjaxSuccess', function(){
	$(function() {
		$('select').styler();
		$( ".date" ).datepicker();
	});
});

Поскольку создать bxajaxid на другой странице нельзя. Но нужно получить часть страницы по ajax. Можно перевести отображение на AJAX вручную.

$external; // условие при котором нужен перевод на ajax
if($external)
{
	$APPLICATION->ShowAjaxHead();
}
$APPLICATION->IncludeComponent(
	'bitrix:catalog.element',
	$template,
	$componentElementParams,
	$component
);
if($external)
{
	require_once($_SERVER['DOCUMENT_ROOT'] . BX_ROOT . '/modules/main/include/epilog_after.php');
	die();
}
// в шаблоне
$APPLICATION->ShowAjaxHead(); // подключает стили и скрипты
$APPLICATION->RestartBuffer(); // полностью очищает