Всем привет, недавно при написании шаблона компонента в Bitrix "Управление сайтом", я столкнулся с проблемой, что в JS скрипте требуются значения переменных из "template.php". Как передать эти переменные из шаблона компонента в script.js?
Рассмотрим файлы template.php и script.js стандартных компонентов Bitrix
Не нужно изобретать велосипед, можно посмотреть в шаблонах стандартных компонентов, как реализован этот функционал. Пример: компонент "catalog.item" - карточка товара на странице раздела.
В файле "template.php" внутри тега <script> создается объект JCCatalogItem. Туда передается массив "$jsParams".
<?php $jsParams = array();
/* здесь массив заполняется данными */?>
<script>
var <?=$obName?> = new JCCatalogItem(
<?=CUtil::PhpToJSObject( $jsParams, false, true)?>
);
</script>
Посмотрим на "script.js": Нас интересует "JCCatalogItem" - происходит определение функции, которая принимает объект с параметрами.
window.JCCatalogItem = function (arParams)
{
/*вначале определяются стандартные значения переменных, ниже
использование arParams*/
if (typeof arParams === 'object')
{
/*Происходит обращения к arParams*/
}
}
Решение проблемы с передачей параметров в JS
Я создал пустой шаблон компонента, чтобы попробовать передать что-либо в "script.js". Создадим массив в файле "template.php" и сделаем вывод "console.log" в "script.js". Код приведен ниже:
/*Код в template.php*/
BX.ready(function () {
var ourJsObj = new ourJs(<?= json_encode($ourParams) ?>);
});
/*Код в script.js*/
ourJs = function (params) {
this.params = params;
console.log(this.params);
};