Работа с формами
Компонент Форма
Форма может содержать либо стандартную, либо кастомную разметку (в форму можно помещать другие компоненты, например таблицы, формы, файлы и т.д.).
Howto по формам можно посмотреть здесь - howto по формам Falcon Space.
Создание формы
Для создания формы необходимо сделать следующее:
-
В меню "Компоненты" выбрать "формы". На странице управления формами нажать кнопку "Новая форма".
-
Настроить параметры формы
-
Настроить поля формы
-
Создать хранимую процедуру fm_{code}_getItem (для формы редактирования. Она получает данные для загрузки текущего состояния формы. Для формы добавления это не нужно делать).
-
Создать хранимую процедуру fm_{code}_checkItem. Она вызывается для проверки полей формы перед сохранением. Если ее нет, то проверка не производится.
-
Создать хранимую процедуру fm_{code}_saveItem. Она сохраняет в базе значения формы при нажатии на кнопку Сохранить.
Способы вывода формы на странице
Форму можно вывести в следующих вариантах:
1. Просто сразу на странице в виде сниппета div с классом as-form
<div class="as-form" data-code="x1" data-itemid="123"></div>
2. Как ссылка на модальную форму. Подробнее про форму в модальном окне.
3. Как контекстное окно рядом с кнопкой (окно закрывается по нажатию на крестик). Подробнее про popover формы.
4. Как выпадающее окно рядом с кнопкой (окно закрывается по нажатию вне окна). Подробнее про dropdown формы.
5. Загрузка формы по ссылке в некий контейнер на странице. Подробнее про загрузку форм по ссылке.
Поля формы
Код - код поля формы.
Название - название поля (отображается на самой форме).
Тип данных - тип данных поля (строка, число, дробное число и прочее, более подробно о типах полей формы ниже в этой статье.)
Placeholder - текст пустого поля.
Подсказка - текст отображающийся при наведении курсора на поле.
Порядок - порядок вывода элемента на форме (чем значение меньше тем элемент располагается выше)
Обязательное поле - если значение установлено в "Да", то система будет проверять заполненность данного поля при проверке или сохранении, и если поле не заполнено будет выдаваться предупреждение, что поле не заполнено.
Хранимка значений - задается источник данных для спискового элемента в форме (пример: выпадающий список значений)
Ширина колонки - задаётся в процентах или пикселях.
Зависимые колонки - указываются названия (код) зависимых полей формы. Пример: есть поле выбора страны, на основании выбора страны следующее поле будет иметь города относящиеся к данной стране. Более подробно здесь
Настройка хранимых процедур для формы
Какие есть процедуры у формы:
- GetItem - заполнение полей формы и изменение настроек файлы.
- CheckItem - проверка полей формы перед сохранением.
- SaveItem - сохранение формы по кнопке.
- Progress - отображение полоски прогресса при заполнении полей формы.
- CheckField - вызывается при изменении поля формы (например, для проверки корректности его значения)
- SaveField - вызывается для одиночного сохранения поля (поменял поле, ушел с него и поле сразу сохранилось)
Процедуры формы генерируются автоматически в настройках формы.
Важно следовать общему стилю и виду шаблонных процедур (они имеют префикс fm_example_).
Хранимая процедура извлечения данных формы GetItem
CREATE PROCEDURE [dbo].[fm_tatest_getItem]
@itemID int, --Стандартные параметры, они всегда приходят в эту процедуру.
@username nvarchar(256)
AS BEGIN -- инициализация формы данными. Названия вывода 1 SELECT должны совпадать с элементами формы
if(@itemID>0) begin --Перед началом можно проверить права данного username -- 1 SELECT значения элементов формы
select * from as_trace t1 where id = @itemID -- 2 SELECT дополнительные параметры настройки формы
/* select 'Редактирование "'+header+'"' Title, '' Subtitle, 'Сохранить' ButtonText, 'success' Background */
-- 3 SELECT некие табличные данные в свободном формате для вывода в форме через JS Render
end else
begin
select 1
end
select '' Title, '' Subtitle, 'h2' HeaderTag, 1 LineLabel
END
На входе:
username = текущий пользователь
itemID - что передано в data-itemID сниппета формы (может быть и строкой, по умолчанию int)/
в процедуру может передаваться необязательный параметр @parameters ExtendedDictionaryParameter в котором передаются системные параметры:
- langID - текущий язык пользователя
- falconGuid - guid пользователя, хранящийся у него в куки (работает для всех пользователей, в том числе неавторизованных), также в этом параметре передаются параметры URL страницы, на которой находится форма
НА выходе 3 SELECT:
- SELECT 1 - данные формы (колонки).
Также в этом запросе указываются метаданные к колонкам:
- возможные дополнительные CSS классы к элементам ставятся через class_{colCode}
- для списковых полей можно задать через параметр dict_{colCode} список возможных значений для элемента в формате Value1,Text1||Value2,Text2||...
- блокировать поле можно через установку в 1 для disabled_{colCode}
- disableXSS_{colCode}. Если 1 то отключает проверку XSS на данном поле
- можно указать что поле можно одиночно редактировать через префикс edt_{colCode}
- можно указать дополнительные подсказки для поля (при клике на них будет меняться значение поля) example_{colCode}. В качестве значения можно указать несколько значений через "||", например value1||value2||value3
- у поля можно указать гибкие настройки через JSON в поле options_{colCode}. Более подробно про настройки по каждому типу поля - /docs/formy--upravlenie-nastroykami-polya-cherez-options--polya
- подмена названия поля title_{colCode}
- тип поля можно переопределить через type_{colCode}
- SELECT 2 - Настройки формы.
- Background (код фона формы, напр success) - задает фон формы.
- ButtonText - текст у кнопки действия (Сохранить).
- ChangeTriggerFieldOnLoad - если указано поле формы (или поля формы через запятую), то при загрузке будет вызвано событие изменения поля (например, чтобы прогрузить некоторые данные через ChangeitemField).
- CopyClipboard - некий текст. Если он указан, то вверху формы возникает значок Буфера обмена, при клике происходит копирование этого текста в буфер обмена.
- DisableAntiXSS - если 1, то для полей ввода будет отключена обработка HTML Encode (т.е. защита от XSS будет отключена и ее надо частично будет реализовать в коде SQL).
- DisableCheckField - если 1, то проверка полей при изменении через процедуру CheckField отключена.
- DisableFocusOnLoad - если 1, то при загрузке формы по умолчанию не будет ставиться фокус ввода на 1 поле формы (актуально когда несколько форм на странице).
- DisableSaveStateChecking - если 1, то для формы не будет выполняться проверка на изменения формы перед случайным закрытием или переходом на другую страницу. По умолчанию такая проверка есть для всех форм - если что-то меняли, то при случайном переходе на другую страницу будет возникать предупреждение о несохраненных данных.
- EditableSuccessMessage - задает текст сообщения об успешном изменении одиночного поля.
- EnablePrint - если 1, то появляется кнопка отправки на печать (печатается только форма, а не вся страница).
- EnterKeyMode - как будет обрабатываться нажатие на Enter на поле. save - сохраняем форму. next -переход к следующему полю (но некоторые поля пропускают - Переключатель, HTML editor и другие сложные поля).
- HeaderTag - h1, h2, h3, h4, h5, h6 - позволяет указать тег для вывода заголовка формы.
- Hide - если 1, то компонент совсем не выведется (пустой div и установка класса hide).
- LineLabel - если 1, то при дефолтовой разметке формы метки полей будут выводиться на отдельной строке (по умолчанию они выводятся слева от элемента управления).
- NoForm - JSON настройки для вывода сообщения (например, нет доступа). При этом форма не показывается совсем - только вывод сообщения. Настройки:
- title - заголовок
- text - текст сообщения
- type - стилизация окна (success,warning,primary, info и т.д.)
- icon - вывод иконки
- alert - если true, то будет выводиться не разметка в форме, а alert окошко справа вверху (в случае модальной формы - модальное окно будет закрываться)
- Subtitle - разметка под заголовком формы.
- Title - заголовок формы.
- TitleTooltip - подсказка-значок рядом с Title формы.
- SELECT 3 - дополнительные табличные данные (произвольные колонки) для вывода через jsRender разметку
- SELECT 4 - вызов внешних действий. См. вызов внешних действий
Хранимая процедура проверки элемента CheckItem
CREATE PROCEDURE [dbo].[fm_test_checkItem]
@username nvarchar(256),
@itemID int,
@parameters ExtendedDictionaryParameter READONLY
AS BEGIN -- процедура проверки корректности данных перед сохранением
declare @ptitle nvarchar(max)
select @ptitle = value from @parameters where [key] = 'title'
declare @id int
select @id = id from as_trace where header=@ptitle and id <> @itemID
if(@id >0) begin
select 0 Result, 'В системе уже есть элемент с выбранным Заголовком (ID='+cast(@id as nvarchar)+')' Msg
end else begin
select 1 Result, '' Msg
end
END
Процедура возвращает модель ResultModel: Result, Msg
Если Result=1 то проверка прошла успешно.
Примечание:
Ранее использовался способ передачи колонок формы как параметров хранимой процедуры (он оставлен для совместимости). В настоящий момент используется коллекция @parameters для передачи колонок (также в рамках этой коллекции дополнительно передаются langID и falconGuid).
Если не хотите использвоать CheckItem - оставьте в ней только select 1 Result, '' Msg
Хранимая процедура сохранения элемента SaveItem
CREATE PROCEDURE [dbo].[fm_metric_saveItem]
@username nvarchar(256),
@itemID int,
@parameters ExtendedDictionaryParameter READONLY
AS BEGIN
declare @pcode nvarchar(max), @ptitle nvarchar(max)
select @pcode = Value2 from @parameters where [key]='code' -- всегда Value2, а не Value
select @ptitle = Value2 from @parameters where [key]='title'
update as_mt_metrics set code = @pcode, title = @ptitle
where id = @itemID
-- SELECT 1 select 1 Result, '' Msg, '' Icon, '' RefreshContainer, 10000 AlertDelay, 0 EnableSaveAlert, '' SuccessUrl, 0 HideFormAfterSubmit
-- SELECT 2 Внешние действия
-- select 'notification' type, 'text1' text , 'demo1' [to], 'ticketExecutor' typeCode, 'http///' url, 'add111' additional select 'email' type, 'ru@rudensoft.ru' [to], 'sub1' subject, 'body1' body
END
Входные параметры:
@username - текущий пользователь
@itemID - переданный параметр itemID
@parameters - коллекция параметров из URL (Key, Value)
Примечание: в @parameters используйте Key, Value2, помимо полей формы там находятся еще следующие параметры:
- buttonType - код кнопки сохранения (если используется множесто кнопок сохранения на форме)
- confirmCode - код подтвержения операции (для спец режима работы формы по подтверждению действия)
- referrer - URL страницы, на которой расположена форма
- langID - ID языка пользователя
- falconGuid -Guid посетителя из куки (в том числе и неавторизованного).
- falconFR - первый внешний источник, откуда пришел пользователь.
- falconFP - первая посещенная страница нашего сайта.
- userIP - IP пользователя
- userPort - порт, по которому обратился пользователь (обычно это 443 или 80)
- domain - домен сайта (в случае если используем несколько доменов для одного и того же сайта).
Первый запрос (SELECT 1) возвращает модель:
- Msg - задает текст сообщения о результате операции (Если передать 1 пробел ' ', то сообщение не будет выводиться. Если пустая строка - то результат по умолчанию),
- Result - если 1 то операция успешно выполнена,
- ItemID - переданный начальный ItemID в форму,
- SuccessUrl - если непустая строка, то после выполнения операции осуществляется переход по этому адресу,
- HideFormAfterSubmit - если 1, то форма скрывается после сохранения (а модальное окно закрывается),
- RefreshContainer - селектор контейнера, который надо обновить (например, можно ставить глобальный контейнер на странице ‘.pHtml’). В итоге после сохранения происходит обновление других компонентов в рамках указанного контейнера,
- Actions - JSON для действий в браузере.
- EnableSaveAlert - если 1, то результат будет всегда выдаваться во всплывающем окне справа наверху (даже несмотря на то, что есть {form-result}),
- Icon - если указано, то будет выводиться данная иконка в сообщении справа вверху. Пример: fa-cube (подробнее о стилизации иконок можно почитать здесь, об анимации иконок здесь),
- AlertDelay - задержка показа окна результата в мс. По умолчанию 30000,
- Type - цветовое решение окна: danger, success, warning, info, primary и т.д.,
- Confirm - JSON объект для вывода окна подтверждения выполнения действия (поля title,text, btnText, confirmCode, system). См. Как сделать окно подтверждения действия формы.
- ReplaceContainer и ReplaceContainerHtml - если есть задача заменить HTML в каком-то блоке, то указываем селектор в ReplaceContainer и разметку в ReplaceContainerHtml.
- RunAction - задается разметка кнопки (например, с as-form-modal), которая будет активирована (событие click) после успешного выполнения SaveItem.
Второй запрос (SELECT 2) это вызов внешнего действия. См. вызов внешних действий
Примечание:
Ранее использовался способ передачи колонок формы как параметров хранимой процедуры (он оставлен для совместимости). В настоящий момент используется коллекция @parameters для передачи колонок (также в рамках этой коллекции дополнительно передаются langID и falconGuid)
Хранимая процедура сохранения одиночного поля SaveField
CREATE PROCEDURE [dbo].[fm_metric_saveEditableField]
@pk nvarchar(128), -- id for item
@fieldCode nvarchar(64), -- form field @value nvarchar(max), -- field value
@username nvarchar(256) -- current user
AS BEGIN
if(@fieldCode='XXXXXXXXXXXXXXXXXXXXX') begin
update as_categories set typeCode = @value where id = @pk
select 1 Result, '' Msg return
end
-- ...
--SELECT 1 Result,Msg select 0 Result, 'Не найден код сущности' Msg
-- SELECT 2 Внешние действия (notification, email и т.д.)
END
Возвращает SELECT 1 (Result, Msg) и SELECT 2 (Внешние действия)
SELECT 1
- Result - результат операции
- Msg - сообщения
- Icon - иконка Font Awesome
- Type - тип окна (primary, success и т.д.)
- RefreshContainer - jquery селектор для обновления части страницы (какую область страницы с компонентами обновить, например ".class1")
- Actions - JSON для действий в браузере.
- ShowContainer - какой контейнер показать, jquery selector
- HideContainer - какой контейнер скрыть, jquery selector
- ReplaceContainer и ReplaceContainerHtml - если есть задача заменить HTML в каком-то блоке, то указываем селектор в ReplaceContainer и разметку в ReplaceContainerHtml.
Также в процедуру можно передавать параметр @parameters типа ExtendedDictionaryParamerer для передачи спец параметров (langID и falconGuid).
Хранимая процедура для заполнения списковых полей
Имя процедуры задается автоматически в виде fm_{formCode}_{colCode}_dict и процедура редактируется через кабинет в Управление колонками.
CREATE PROCEDURE [dbo].[fm_notificationType_categoryName_dict]
@username nvarchar(256)
@itemID int
AS BEGIN
select 'Не выбрано' Text, 0 Value, 0 Selected -- 'Group1' optGroup для категорий в списке. (и по нему же должна быть сортировка)
union
select name Text, id Value, Selected from as_nt_notificationCategories order by Text
END
Передается ItemID на случай использования универсальной процедуры. На выходе модель Value, Text, Selected, Disabled, OptGroup, Color (в некоторых случаях еще Value2).
Примечание.
- В процедуру может передаваться необязательный параметр @parameters DictionaryParameter в котором передаются системные параметры (langID, falconGuid)
- Ранее использовалось поле для хранения имени процедуры. Он остался рабочим для совместимости. Сейчас это поле не выводится и вместо него необходимо использовать новые процедуры с редактированием через кабинет.
- Если нужен элемент Не выбрано, то можно сделать union select 0 Value, ‘Не выбрано’ Text
- OptGroup используется для организации списка с категориями (для этого первый optGroup должен быть непустым и список должен быть упорядочен по optGroup).
- Если установлен Color - то список и его элементы будут иметь указанные цвета.
- Если стоит Disabled=1, то элемент списка будет неактивен.
Хранимая процедура для проверки одиночных полей при заполнении формы CheckItemField
Если существует подобная процедура с именем fm_{entity}_checkItemField, то она будет вызываться всякий раз, когда редактируется одно из полей формы.
Входные параметры:
@username - текущий пользователь
@itemID - переданный параметр itemID
@field - код поля
@value - текущее значение поля
@parameters - коллекция параметров из URL (Key, Value)
CREATE PROCEDURE [dbo].[fm_metric_checkItemField]
@username nvarchar(256),
@itemID int,
@field nvarchar(256),
@value nvarchar(max),
@parameters ExtendedDictionaryParameter readonly -- необязательный
AS BEGIN
if(@field = 'roles') begin
if(charindex(' ', @value)>0) begin
select 'В ролях не должно быть пробелов!' Msg, 0 Result, '.projectStageCont' RefreshContainer, '.p1' ShowContainer, '.p2' HideContainer, '' ReplaceContainer, '' ReplaceContainerHtml
end
end
-- SELECT 1
select '' Msg, 1 Result
-- SELECT 2 Outer actions
END
На входе - ID сущности, код поля, значение и текущий пользователь.
Также в процедуру можно передавать параметр @parameters типа ExtendedDictionaryParamerer (Key, Value2) для передачи спецпараметров (langID и falconGuid) и текущие значения других полей формы.
Этот параметр также используется для извлечения данных, полученных из внешнего API.
На выходе:
SELECT 1
- Msg - сообщение
- Result - 1 или 0 (если 0 - значит поле невалидное)
- RefreshContainer - jquery селектор для обновления части страницы (какую область страницы с компонентами обновить, например ".class1")
- ShowContainer - какой контейтер показать, jquery selector
- HideContainer - какой контейтер скрыть, jquery selector
- ReplaceContainer и ReplaceContainerHtml - если есть задача заменить HTML в каком-то блоке, то указываем селектор в ReplaceContainer и разметку в ReplaceContainerHtml.
SELECT 2 - вызов внешних действий
Также вы можете задать коллбек для обработки в JS результата проверки поля - as.formcallbacks["{formCode}_checkField"](params, data).
Хранимая процедура отображения статуса заполнения формы Progress
CREATE PROCEDURE [dbo].[fm_knowledgeBaseArticle_progress]
@username nvarchar(256),
@itemID int,
@parameters ExtendedDictionaryParameter Readonly
AS BEGIN
-- процедура для визуализации прогресса формы
declare @fieldchannel nvarchar(max) = ''
select @fieldchannel = value from @parameters where [key]='channel'
-- SELECT 1 select 1 Result, '' Msg
-- SELECT 2 набор индикаторов прогресса
select 'Первый параметр' Title, 40 Value, 'Хорошо' [Text]
union
select 'Второй параметр' Title, 20 Value, 'Не очень' [Text]
END
Пример: [fm_example_progress]
На входе все элементы формы (передаются из несохраненной формы в параметре @parameters, там же передаются langID и falconGuid).
На выходе:
SELECT 1 - Result, Msg
SELECT 2 - Text, Value (от 0 до 100), Title
Эта процедура вызывается, если установлен тип прогресс-бара в GetItem Select 1: 'circle|line' ProgressType
Вызывается при каждом изменении элементов формы и выводится там где разметка {form-progress}
Примечание:
Круговая диаграмма работает только со значениями, кратными 10 (т.е. округляет до десятков). Если вам нужно использовать точные значения (например, отображать скидку в 3.5%, то используйте line режим для отображения прогресса).
Типы полей формы
Пример полей формы на демостенде
Вы можете использовать следующие типы полей
- Editor (CSS), editorCSS - редактор CSS с подсветкой синтаксиса
- Editor (HTML), editorHTML - редактор HTML с подсветкой синтаксиса
- Editor (JS), editorJS - редактор JS с подсветкой синтаксиса (если нужно отменить возможность форматировать код - ставим CSS класс as-disableAutoFormat)
- Editor (SQL), editorSQL - редактор SQL с подсветкой синтаксиса
- hidden - input type=hidden поле. Просто значение поля прокидывается из GetItem в SaveItem через форму (внимание, пользователь может его изменить через HTML).
- HTML, html - выбор Rich редактора tinyMCE
- HTML Lite, html-lite - выбор Rich редактора tinyMCE в упрощенном виде
- HTML5 Color, html-color - редактирование цвета
- HTML5 Date, html-date - поля для ввода даты. Форма сохранения YYYY-MM-DD (и не зависит от настройки в GetLayoutInfo dateFormat!)
- HTML5 Datetime local, html-datetime-local - поле для ввода даты и времени без учета часового пояса. Формат сохранения YYYY-MM-DDTHH:MM, ВАЖНО - datatime-local не работает в Firefox (поэтому используйте в большинстве случаев поля date + time).
- HTML5 Email, html-email - редактирование email
- HTML5 Month, html-month - выбор месяца. Формат сохранения YYYY-MM.
- HTML5 Number, html-number - выбор числа
- HTML5 Tel, html-tel - поле для телефона (установка формата делается через GetLayoutInfo, параметр phoneFormat, а для лендов добавить hidden поле с классом as-phoneFormat, и value="+d ddd-ddd-dddd")
- HTML5 Time, html-time - поле для ввода времени/ Формат сохранения HH:MM
- HTML5 Url, html-url - поле для ввода URL
- HTML5 Week, html-week - выбор недели. Формат сохранения 2020-W01 (YYYY-WWW).
- localStorage, sessionStorage, cookie, urlParameter - скрытые поля для передачи параметров в saveItem из куки, локальных ресурсов браузера или из URL.
- Альтернативный способ выбора содержимого текстовых файлов, textFile - файл не грузится на сервер, а содержимое файлов извлекается из него прямо в браузере. Подробнее.
- Ввод пароля, password - используется в формах регистрации. Скрывает ввод в виде звездочек.
- Выбор radio, radio - одиночный выбор через радиокнопки (в стиле связанных кнопок Bootstrap)
- Выбор иконки, iconPicker - выбор иконки Font Awesome. В базе значение хранится в текстовом виде, например, fas fa-search
- Выбор времени, time - выбор времени из выпадающего списка
- Выбор диапазона дат, daterange - (формат даты можно задать через настройку format либо использовать глобальную настройку dateFormat в GetLayout)
- Выбор места (гео), geo-autocomplete - вывод поля с поиском геолокации. Формат хранения значения - {lat}||{lon}||{geotext}||{JSONOptions}
- Выбор файла, files - можно добавлять файлы к форме (в том числе и в форме на добавление, когда еще нет сущности, к которой привязывать файлы). Подробнее.
- Дата выбор, date - выбор даты через плагин Datepicker (формат устанавливается в GetLayout в параметре dateFormat).
- Дерево с галочками, treeCheckboxes - выбор галочек в иерархическом списке
- Дробное число, float - число с плавающей точкой
- Картинки Radio, imageRadio - выбор через радиокнопки с картинкой
- Картинки Флажки, imageCheckboxes - выбор флажков с картинками.
- Многострочный текст, text - вывод textarea
- Переключатель, switch - чекбокс в виде переключателя (Да, Нет). В placeholder можно задать текст вместо Да/Нет. Для изменения размера можно передать классы в GetItem SELECT 1 ( 'as-switch-large' class_immediatelyLoad). as-switch-large, as-switch-mini, as-switch-small
- Подсказки dadata, dadata - поле с выпадающими подсказками по разным объектам - адреса, компании, банки и т.д. (демо)
- Слайдер значений, slider - выбор числа или диапазона чисел в виде ползунка.
- Содержимое файла, fileContent - загрузка файла через менеджер ресурсов и передача его содержимого в SQL процедуру в виде строки. Подробнее.
- Сортировка дерева, treeOrder - управление структурой дерева через Drag&Drop
- Список chosen, chosen - выбор из списка с возможностью поиска
- Список, select - комбосписок для одиночного выбора
- Список множественный chosen, chosenMiltiple - множественный выбор элементов из списка (в сохранение они идут как id через запятую).
- Список-поиск, select-search - поиск через autocomplete
- Список 2 (более функциональный), select2 - выбор элемента с поиском, добавлением элемента
- Стандартный выбор radio, defaultRadio - стандартный выбор из радиополей.
- Строка по шаблону, patternString - вводим некую строку, разбираем регулярным выражением и выводим разметку с неким значением (например, ввод ютуб ссылки и вывод iframe)
- Строка, string - текстовое поле в 1 строку
- Таймер, timer - поле, которое позволяет запускать таймер по секундам. Время в итоге передается в виде mm:ss.
- Установка рабочего графика, weekTime - позволяет выбрать определенные часы в неделе.
- Флажки, checkboxes - множественный выбор через галочки
- Флажок, bool - чекбокс
- Файл на внешнем ресурсе, remoteFile - указание URL и передача в процедуру saveItem тела файла, загруженного по данному URL. Подробнее.
- Целое число, int - целочисленное число
- Цвет множ. colorCheck, цвет colorRadio - выбор цвета (одиночный и множественный). В value - цвет, в text - текст (необязательно).
Примечание: если HTML5 будут введены некорректно, то они подсвечиваются розовым и форма не будет сохраняться, пока не будут исправлены ошибки.
Некоторые типы полей имеют дополнительные настройки в GetItem SELECT 1 в параметрах options_{code}. Подробнее
Форма с редактированием по отдельным полям (мгновенное сохранение полей, editable поля).
Можно сделать форму, где каждое поле будет сохраняться отдельно.
Для этого необходимо сделать следующее:
- В GetItem установить какие поля будут редактируемые, для этого добавляем в SELECT 1 выходные колонки вида 1 edt_{colName} (тем самым эти колонки будут реагировать на изменения и вызывать сохранение этих полей).
- Реализовать процедуру SaveField (сохранение отдельных полей формы).
- Кнопку Сохранить либо скрыть через CSS, либо использовать кастомную разметку формы и не вставлять кнопку в разметку.
Примечание:
1. Данный режим сохранения подходит для полей ввода, галочек, радиопереключателей, textarea, выбора из списка. Режим не работает для набора галочек и для сложных полей типа Code Editor.
2. Если вам необходимо установить вывод сообщения после успешного сохранения поля, то используйте в процедуре формы GetItem в SELECT 2 параметр EditableSuccessMessage (строка).
Форма с дополнительными параметрами
Бывают случаи когда нужно в форму передать несколько параметров (а не только data-itemID).
Форма без параметров
Данная форма может использоваться для выполнения каких-либо действий.
Т.е. выводим информацию с помощью Getitem и кастомной разметки + выполняем действие.
Важно! В процедурах CheckItem и SaveItem не должно быть параметров fieldName.
Работа с внешним источником API в форме
Среди настроек формы есть 3 параметра подключения внешних источников (коды API запросов через запятую, для выполнения исходящих запросов при различных событиях формы):
- GetItem API - запускается перед GetItem процедурой (загрузка формы).
- SaveItem API - запускается перед SaveItem процедурой (нажали кнопку Сохранить).
- CheckField API - запускается перед CheckField процедурой (изменили поле).
Результат ответ запроса API передается в хранимую процедуру через параметр @parameters ExtendedDictionaryKey (в Key пишется код запроса).
Решение проблем
Не получается корректно сохранить скрипт в форме
При использовании script
при кастомной разметке формы возникает проблема вложенных тегов script. Поэтому не используйте для формы кастомную разметку в случае если планируется эту форму использовать для редактирования каких-либо скриптов (теги script, например счетчики).
Ошибка при начальной загрузке формы
fm_{code}_getItem - всегда должен возвращаться какой-то результат. Если ваша форма на добавление, то можете просто возвращать select 1.
Криво выводятся подписи для элементов формы
Используйте разметку bootstrap для скелета формы (классы row, col-md-X и т.д.). Для меток используйте тег label с классом as-form-cap.
Множественный вызов GetItem процедуры
Дело в том, что процедура GetItem вызывается не только при первичной загрузке формы, но и при выполнении значимых действий (инициализация объекта формы) - при сохранении, при отслеживании изменения поля или сохранения одиночного поля и т.д.
Если вам необходимо отследить первый инициализирующий запуск GetItem, то используйте параметр isMainLoadForm в @parameters.
Пример:
CREATE PROCEDURE [dbo].[fm_myForm_getItem]
@itemID nvarchar(256),
@username nvarchar(256),
@parameters ExtendedDictionaryParameter readonly
AS
BEGIN
declare @isMainLoadForm bit = (select try_cast(value2 as bit) from @parameters where [Key]='isMainLoadForm')
print @isMainLoadForm
END
Для первичной загрузки параметр будет равен 1, в других случаях 0.
Howto по формам
Полный список вопросов, как реализовать ту или иную возможность на форме, описан в разделе Howto Формы.
Google поиск по нашей документации
- Руководства
- Основа Falcon Space
- Основные компоненты Работа со статусами. Управление статусами заявок, сущностей в личных кабинетах пользователей Работа с таблицами. Создание таблиц на сайте Работа с формами Работа с дашбордами личных кабинетов Диаграммы и графики в личном кабинете на сайте Календарь. Управление событиями в личном кабинете Терминал - рабочее пространство с окнами и вкладками
- Возможности
- Коммуникация с пользователем
- Дизайн, стилизация
- Лендинги
- Универсальный API
- Примеры интеграций
- Каталоги
- Навигация
- Документы
- Дополнительные компоненты
- Продвижение, SEO
- Системные моменты
- Системное администрирование
- HOWTO
- Таблицы
- Формы
- Загрузка файлов, картинок
- Работа с SQL
- HOWTO JS
- HOWTO Верстка
- Решение проблем
Falcon Space
Это снижение стоимости владения
за счет меньшего количества людей для поддержки и узкого стека разработки. Про снижение стоимости владения продуктом
Это быстрое внесение изменений
по ходу эксплуатации программы. Как создается функционал на платформе
Это простой удобный интерфейс
адаптация под мобильные устройства. Про юзабилити платформы