Использование типовой разметки в виде сниппетов для решения различных задач

Платформа имеет некоторые специальные сниппеты разметки для облегчения реализации некоторых функций.

Установка PWA приложения по ссылке

<a href="#" class="as-pwa-install">Install</a>

Вывод youtube видео в модальном окне

<a href="#" class="as-youtube" data-itemid="reCjV565_7M" data-title="Falcon Space">
   <i class="fab fa-youtube"></i> Видео
</a>

В itemID задаем идентификатор видео (его можно взять из URL видео на Ютуб)

Загрузка таблицы/формы по ссылке

<a href="#" class="as-table-link" data-code="watch_table" data-itemid="" data-target="#div1" data-mode="append" data-hidelink="1">Загрузка таблицы в контейнер #div1</a>

<div id="div1" class="bg-info p-3">
  Контейнер, куда добавится таблица по клику на элементе
</div>

Подробнее - https://falcon.web-automation.ru/docs/tablicy--zagruzka-tablicy-po-ssylke

По аналогии делается загрузка формы по ссылке (класс as-form-link)

Вывод таблицы/формы в модальном окне

Таблица в модальном окне: 

<a href="#" class="as-table-modal" data-code="profile" data-itemid="11" data-big="1" data-slideout="2">Show table</a>

Подробнее - https://falcon.web-automation.ru/docs/tablicy--kak-sdelat-tablicu-v-modalnom-okne--otkryvaetsya-v-dialogovom-okne

Модальная форма: 

<a href="#" class="as-form-modal" data-code="profile" data-itemid="11" data-big="1" data-btntext="Сохранить">Show Form!</a>

Подробнее - https://falcon.web-automation.ru/docs/formy--kak-sdelat-modalnuyu-formu--otkryvaetsya-v-dialogovom-okne

Вывод разметки в модальном окне 

<a href="#" class="as-modal" data-title="Title 1" data-content="<p class='lead'>Text 1</p>" data-big="1" data-slideout="2">Modal link</a>

Подробнее - https://falcon.web-automation.ru/docs/modalnaya-ssylka--as-modal

Вывод контента или формы во всплывающем контекстном окне (popover)

<a href="#" class="as-popover btn btn-light" data-content="" data-title="Заголовок окна" data-trigger="manual" data-type="primary" data-size="lg" data-formcode="newForm" data-formitemid="">Show form</a>

Если форма не нужна - то используем только content атрибут, а formCode не указываем

Подробнее  - https://falcon.web-automation.ru/docs/formy--kak-vyvesti-formu-vo-vsplyvayushchem-okne-ryadom-s-knopkoy

Вывод списка картинок с возможностью просмотра большой картинки в модальном окне

<div class="as-lightbox">
	<a href="#" class="as-lightbox-item" data-title="Таблицы" data-url="/uploads/land/intro/c1.jpg">
       	<img alt="" src="/uploads/land/intro/c1-thumb.jpg">
    </a>
	<a href="#" class="as-lightbox-item" data-title="Таблицы" data-url="/uploads/land/intro/c1.jpg">
       	<img alt="" src="/uploads/land/intro/c1-thumb.jpg">
    </a>
</div>

Вывод на печать некой части страницы

<a href="as-print" data-cont=".class1">Print</a>

Если нужна вся страница то указываем в cont=body

Плавный переход к некому блоку на странице

<a href="#cont1" data-duration="400" data-shift="100">Go to cont1</a>

duration указывает кол-во мс на скроллинг к месту

href задает селектор контейнера, к которому будет делаться переход

shift задает вертикальное смещение в пикселях от целевого элемента при скроллинге.

Falcon Space - функциальная веб-платформа разработки на узком стеке MS SQL/Bootstrap. Вводная по Falcon Space
Насколько полезной была статья?

Google поиск по нашей документации

Falcon Space

Это снижение стоимости владения

за счет меньшего количества людей для поддержки и узкого стека разработки. Про снижение стоимости владения продуктом

Это быстрое внесение изменений

по ходу эксплуатации программы. Как создается функционал на платформе

Это простой удобный интерфейс

адаптация под мобильные устройства. Про юзабилити платформы