Начало работыОснова Falcon SpaceРуководстваВозможностиКоммуникация пользователейТаблицыФормыПоля формыЛендингиДизайн, стилизация, юзабилитиУниверсальный APIИнтеграцииКаталогиНавигацияДокументыДополнительные компонентыПродвижение, SEOСистемные моментыСистемное администрированиеHOWTOЗагрузка файлов, картинокHOWTO SQLHOWTO JSHOWTO ВерсткаРешение проблемСоветы по реализации
Falcon Space - платформа для создания сайтов с личными кабинетами
В 2-3 раза экономнее и быстрее, чем заказная разработка
Более гибкая, чем коробочные решения и облачные сервисы
Используйте готовые решения и изменяйте под свои потребности
Настройка сниппета таблицы
Время чтения - 4 мин.Дата публикации 16.10.2025 (обновлено 28.02.2026)
<div class="as-table" data-code="dashboardPanels" data-itemid="566"></div>
Сниппет таблицы обрабатывается платформой и визуализируется в таблицу с данными.
Вы можете кастомизировать стили таблицы через data атрибуты в сниппете таблицы
Например, поставим кнопку фильтра красной с иконкой глаза:
<div class="as-table" data-code="watch_customClassesIcons" data-filterbtnclass="btn btn-primary" data-filterbtnicon="fa fa-eye"></div>
Пример на демостенде - https://demo.web-automation.ru/list/watch/kastomizaciya-knopok-stiley-tablic---66
Описание data элементов разметки
- data-code - код таблицы
- data-itemID- переданный в сниппете значение, которое можно передать в разметке сниппета (например, id категории). Если нужен параметр из url, то можно написать в фигурных скобках url-itemID (извлечение из URL работает только когда сниппет ставится на Страницу, а не внутри компонента).
Описание data-* параметров по стилизации таблицы(с указанием значения по умолчанию):
- cellClass - указание CSS классов у ячейки (например h2, lead),
- tableClass - добавляет CSS класс к тегу таблицы (можно использовать классы bootstrap - table-dark table-hover table-striped table-bordered table-borderless table-sm),
- filterBtnIcon = "fa fa-search" - иконка Font Awesome у кнопки фильтра. Смотреть иконки Font Awesome,
- filterBtnClass = "btn btn-secondary btn-md",
- showTypicalFilterBtn - если 1, то показывать кнопку сохранения типовых комбинаций фильтров,
- typicalFilterBtnIcon = "fa fa-bars" - кнопка типовые фильтры,
- typicalFilterBtnClass = "btn btn-light btn-md",
- resetFilterBtnIcon = "" - кнопка сброса фильтра,
- resetFilterBtnClass = "btn btn-light btn-md",
- titleTooltipIcon = "fa fa-info-circle" - подсказка рядом с названием,
- titleTooltipClass = "btn btn-circle text-primary",
- titleClass = "" - css класс для контейнера заголовка,
- subtitleClass = "" - css класс для контейнера подзаголовка,
- toolbarClass = "" - css класс для контейнера панели рядом с названием,
- groupToolbarClass = "" - css класс для контейнера панели групповых действий,
- operationClass-code1 = "btn btn-light " - CSS классы кнопки операции (code1 - код операции),
- removeBtnIcon = "fa far fa-trash-alt" - кнопка удаления в строке,
- removeBtnClass = "",
- commentsBtnIcon = "fa fa-comment" - кнопка комментариев в строке,
- commentsBtnClass = "",
- numColHeader = "#" - заголовок столбца с порядковым номером,
- createBtnIcon = "fa fa-plus"; - кнопка быстрого создания,
- createBtnClass = "btn btn-primary",
- createModalType = "primary" - кнопка в строке для modal_ режима ,
- modalBtnIcon = "fa fa-dot-circle",
- modalBtnClass = "",
- subBtnPlusIcon = "fa-plus" кнопка в строке для sub_ режима (важно! здесь только 1 класс без fa добавки),
- subBtnMinusIcon = "fa-minus",
- subBtnClass = "" ,
- noItemsClass = "alert alert-info my-3" панель "Не найдено",
- noItemsIcon = "fa fa-frown",
- alwaysShowGroupPanel = "" Если стоит непустая строка, то панель групповых действий будет видна всегда, но при этом если нет выбранных галочек, то кнопки в этой панели будут активны (для кнопок операции будут проверяться выбранные галочки. Если их нет то выводится сообщение из этой настройки data-alwaysShowGroupPanel),
- disableRemoveConfirm - если "1", то не будет запрашиваться подтверждение удаления строки таблицы (confirm),
- progress - если указана иконка font awesome (fa fa-bars) или путь к картинке, то она будет загружаться в форму, пока идет прогрузка данных. Т.е. выполняет роль элемента прогресс-бара (аналогичный параметр есть и у Формы).
Примечание: для данных настроек вы можете их глобально установить в as.systemOptions.js через код вида "table.{code}", например:
{ "table.createBtnClass": "btn btn-danger" }
Google поиск по нашей документации
Запрос расчета стоимости веб-проекта на базе Falcon Space
- Шаг 1. Создать концепт проекта
- Шаг 2. Получить оценку бюджета (КП)
- Шаг 3. Заключить договор
- Шаг 4. Создать совместно техническое задание
- Шаг 5. Поэтапная реализация проекта