В CMS Битрикс есть отличная встроенная js библиотека. Для того что бы воспользоваться ей, достаточно обратится к глобальному объекту BX.
Пример того как можно прятать элемент DOM в админке Битрикс не подключая для этого jQuery:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
BX.ready(function () {//Ожидаем загрузки страницы (аналог jQuery(document).ready let select_price = document.querySelector('[name="select_price_type"]')//Наш целевой select .addEventListener('change', function () {//подписываемся на событие изменения значения select for (let element of document.querySelectorAll('.price_type')) {//обход каждого элемента с классом BX.hide(element);//Скрытие всего по умолчанию при выборе option } if (this.value !== 'all') { for (let element of document.querySelectorAll('.' + this.value)) { BX.show(element);//Показать элемент таблицы } } else { for (let element of document.querySelectorAll('.price_type')) { BX.show(element); } } }); }); |
BX.hide() и BX.show() принимают объект JavaScript и скрывают или показывают переданный элемент страницы.
На примере выше, у нас есть некоторое поле select, при выборе элементов которого происходит скрытие(показ ) элементов таблицы в админке Bitrix.
document.querySelectorAll — поиск всех элементов содержащих нужный нам класс(в данном случае).