Формы. Как сделать кастомную HTML разметку для формы (jsRender)

Указываем кастомную разметку в полей настройках формы. Используем следующие псевдоэлементы:

  • {form-title} - заголовок формы
  • {form-result} - здесь будет выводиться результат операции сохранения формы
  • {form-subtitle} - подзаголовок формы
  • {form-button} - кнопка сохранения формы
  • {colwithlabel-[fieldcode]} - поле с меткой
  • {colcontrol-[fieldcode]}  - выводит только элемент управления без метки
  • {colview-[fieldcode]} - выводит значение поля (с подсказкой, если она есть)
  • {collabel-[fieldcode]} - выводит метку поля
  • {colexample-[fieldcode]} - вывод примеров заполнения форм (сами примеры задаются в GetItem SELECT1 в полях example_{colCode})
  • {pageCode} - код страницы (можно использовать для условий вывода определенных блоков).

Начальную разметку можно сгенерировать (после создания столбцов используя кнопку наверху Генерация разметки формы). При этом в модальном окне будет выведена начальная разметка, которую вы можете скопировать в поле формы CustomHTML.

Пример настроек:

В кастом разметке можно использовать правила JS Render

В консоли браузера (Chrome F12/Console) вы можете посмотреть какой объект передается в JS Render (метка - JSRender Form).

Документация по JS Render - https://www.jsviews.com/#jsrtags

Простой пример (когда на форме добавления надо спрятать какие то элементы формы).

Примечание: не забывайте использовать заголовок ({form-title}) для модальных форм, чтобы для них выводились служебные значки (перейти на управление формой, печать и перенос sql формы). При необходимости можно спрятать сам заголовок через CSS.

Примечание