Блокировка сохранения элемента приложения

Цель:
Проверить на корректность данные, введенные на форме создания элемента приложения, и сделать кнопку «Сохранить» неактивной до тех пор, пока все данные на форме не будут корректны.
В нашем случае нужно на форме создания в приложении Сделки системного раздела CRM проверить, что бюджет сделки - не менее суммы минимального заказа (1000 руб.). Менеджер, оформляя сделку, будет видеть предупреждение, если сумма сделки не будет соответствовать этому условию, и не сможет сохранить карточку сделки.


Решение:
Создать шаблон формы создания, и добавить в шаблон формы свойство, которое будет обязательным к заполнению, если не все данные на форме корректны.


Шаги реализации:
1) Зайдем в настройки формы приложения, включим расширенный режим (если он еще не применен в этом приложении) и перейдем на вкладку «Создание». Создадим шаблон формы создания.

В случае с приложением «Сделки» в системном разделе CRM шаблон формы создания есть по умолчанию, нужно лишь в настройках формы на вкладке «Создание» нажать на кнопку «Редактировать форму».

2) В открывшемся шаблоне перейдем на вкладку «Контекст» и добавим новое свойство. Пусть это будет свойство типа «да/нет», и оно будет называться "Проверьте корректность данных на форме" (код свойства «stopper»).

3) Создадим еще одно свойство типа «да/нет» с названием «Скрыть предупреждение», код свойства «hideWarning». Установим значение по умолчанию «Да».

4) Теперь перейдем на вкладку «Шаблон». На панели справа в списке виджетов выберем виджет «Информационный блок» и перетащим его на форму. Выберем тип информации «Ошибка (красный)» и введем текст предупреждения «Бюджет сделки меньше суммы минимального заказа (1000 руб.).».
На вкладке «Системные» в настройках «Скрыть» установим связь (нажав на пиктограмму справа) со свойством «Скрыть предупреждение».
Сохраним настройки виджета.

5) На панели справа выберем вкладку «Свойства» и из списка «Свойства виджета» перетащим на форму свойство «Проверьте корректность данных на форме».
В настройках свойства установим флаг «Обязательное поле».
Здесь же, в настройках свойства, перейдем на вкладку «Системные» и установим флаг «Скрыть».
Сохраним настройки.

6) Также перетащим на форму свойство «Бюджет». В настройках свойства установим флаг «Обязательное поле».
На вкладке «События» создадим функцию «onChangeBudget», которая будет выполняться при изменении значения в поле "Бюджет".

7) Сейчас шаблон формы выглядит так:



8) При создании функции «onChangeBudget» (см.п.7) система автоматически откроет вкладку «Сценарии», где уже будет объявлена эта функция.
Введем следующий код:

Код:

async function onChangeBudget(): Promise<void> {
    if (!Context.data._budget || (Context.data._budget.cents < (1000 * 100))) {
        ViewContext.data.hideWarning = false;
        ViewContext.data.stopper = undefined;
    } else {
        ViewContext.data.hideWarning = true;
        ViewContext.data.stopper = true;
    }
}

Чтобы обратиться к свойствам из контекста формы, мы использовали «ViewContext».
Теперь свойство «Проверьте корректность данных на форме» будет не заполнено, если бюджет меньше 1000 руб. (а поскольку это свойство обязательно, у пользователя не будет возможности сохранить форму) .Также в этом случае увидим предупреждение (свойство «Скрыть предупреждение» = «Нет»).

9) Опубликуем форму и выйдем из нее.

10) Вернемся в настройки формы приложения «Сделки», на вкладку «Создание», и удалим свойство «Бюджет» из столбца «Название на форме», т.к. все свойства в этом столбце отображаются в виджете «Стандартная форма элемента». Сохраним изменения.
Поскольку мы вынесли свойство «Бюджет» в шаблон формы, и в шаблоне также есть виджет «Стандартная форма элемента», если бы мы не удалили «Бюджет», это поле дублировалось бы при создании сделки.

Вот и всё. Создадим сделку. Если сумма бюджета меньше 1000 руб., видим предупреждение на форме, и кнопка «Сохранить» неактивна.


Если бюджет >= 1000 руб., предупреждение не отображается, и сделку можем сохранить.