levis/help365
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

push ru help
All checks were successful
Deploy Static Site / deploy (push) Successful in 6m55s
Details

Browse Source
This commit is contained in:
koziavin
2025-05-28 05:24:40 +04:00
parent 0113fb8289
commit 041abbbd24
4459 changed files with 121310 additions and 86248 deletions
Download Patch File Download Diff File Expand all files Collapse all files

184
platform/button_widget.html
View File

@ -1,19 +1,20 @@
<!DOCTYPE html>
<html lang="en">
<html lang="ru">
<head>
<title>Button</title>
<title>Кнопка</title>
<meta name="generator" content="Help+Manual" />
<meta name="keywords" content="" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="This widget allows you to add a button to a page, app or task form. You can use a script to define the on-click behavior of the button." />
<meta name="description" content="Данный виджет позволяет добавить кнопку на страницу, форму приложения или задачи. С помощью скрипта можно определить поведение кнопки при нажатии." />
<meta name="picture" content="" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Full documentation for BRIX365 platform. Low-code developer guide. User guide. Admin guide. Developer guide." />
<meta property="og:url" content="https://brix365.com/en/help" />
<meta property="og:image" content="" />
<meta property="og:title" content="Cправка по Low-code платформе ELMA365" />
<meta property="og:url" content="https://elma365.com/ru/help" />
<meta property="og:image" content="" />
<meta property="og:site_name" content="ELMA365" />
<link rel="icon" href="favicon.png" type="image/png" />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet" />
@ -23,6 +24,7 @@
<link rel="stylesheet" href="./article.css" />
<link rel="stylesheet" href="./glossary.css" />
<link rel="stylesheet" href="./theme.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="helpman_settings.js"></script>
<script type="text/javascript" src="helpman_topicinit.js"></script>
@ -34,16 +36,16 @@
</head>
<body>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-M6ETBEC1R9"></script><script>window.dataLayer=window.dataLayer || []; function gtag(){dataLayer.push(arguments);}gtag('js', new Date()); gtag('config', 'G-M6ETBEC1R9');</script>
<script>!function(e,t,c,n,r,a,m){e.ym=e.ym||function(){(e.ym.a=e.ym.a||[]).push(arguments)},e.ym.l=1*new Date;for(var s=0;s<document.scripts.length;s++)if(document.scripts[s].src===n)return;a=t.createElement(c),m=t.getElementsByTagName(c)[0],a.async=1,a.src=n,m.parentNode.insertBefore(a,m)}(window,document,"script","https://mc.yandex.ru/metrika/tag.js"),ym(83179930,"init",{clickmap:!0,trackLinks:!0,accurateTrackBounce:!0,webvisor:!0})</script><noscript><div><img alt=""src=https://mc.yandex.ru/watch/83179930 style=position:absolute;left:-9999px></div></noscript>
<header class="header elma-365">
<div class="container">
<a class="header__logo" href="https://brix365.com/en/help">
<img src="./logo-en.svg" alt="header logo">
<a class="header__logo" href="https://elma365.com/ru/help">
<img src="./logo.svg" alt="header logo">
</a>
<!-- <div class="hero__search-form" id="search-panel">
<form class="search-form" onsubmit="ym(83180416,'reachGoal','poisk')">
<form class="search-form" onsubmit="ym(83179930,'reachGoal','poisk')">
<label class="search-form__label">
<span id="reset-search" class="search__icon"></span>
<input class="search-form__input" type="text">
@ -63,7 +65,7 @@
</div>
<div class="header__navi">
<ul class="header__list"><li><span class="solution-select"><span class="solution-select__selected"></span><svg width="7" height="4" viewBox="0 0 7 4" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1L3.5 3.5L6 1" stroke="white" stroke-linecap="round" stroke-linejoin="round"/></svg><ul class="solution-select__list"><li><a class="project-link" href="https://brix365.com/en/help/platform/get-trial.html">Platform</a></li><li><a class="project-link" href="https://brix365.com/en/help/ecm/ecm-functions.html">ECM</a></li><li><a class="project-link" href="https://brix365.com/en/help/crm/crm_overview.html">CRM</a></li><li><a class="project-link" href="https://brix365.com/en/help/service/service-functions.html">Service</a></li><li><a class="project-link" href="https://brix365.com/en/help/projects/projects-functions.html">Projects</a></li><li><a class="project-link" href="https://brix365.com/en/help/business_solutions/-elma365-store.html">Business Solutions</a></li></ul></span></li><li><a href="https://api.brix365.com/en/" target="_blank">API</a></li><li><a href="https://tssdk.brix365.com/" target="_blank">SDK</a></li></ul>
<ul class="header__list"><li><span class="solution-select"><span class="solution-select__selected"></span><svg width="7" height="4" viewBox="0 0 7 4" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1L3.5 3.5L6 1" stroke="white" stroke-linecap="round" stroke-linejoin="round"/></svg><ul class="solution-select__list"><li><a class="project-link" href="https://elma365.com/ru/help/platform/get-trial.html">Платформа</a></li><li><a class="project-link" href="https://elma365.com/ru/help/ecm/ecm-functions.html">ECM</a></li><li><a class="project-link" href="https://elma365.com/ru/help/crm/crm_overview.html">CRM</a></li><li><a class="project-link" href="https://elma365.com/ru/help/service/service-functions.html">Service</a></li><li><a class="project-link" href="https://elma365.com/ru/help/projects/projects-functions.html">Проекты</a></li><li><a class="project-link" href="https://elma365.com/ru/help/business_solutions/-elma365-store.html">Бизнес-решения</a></li></ul></span></li><li><a href="https://api.elma365.com/ru/"target="_blank">API</a></li><li><a href="https://tssdk.elma365.com/"target="_blank">SDK</a></li><li><a href="https://community.elma365.com/" target="_blank">Community</a></li><li><a href="https://elma-academy.com/ru/" target="_blank">Академия</a></li><li><a href="https://elma365.com/ru/" target="_blank">Сайт ELMA365</a></li></ul>
</div>
@ -78,8 +80,8 @@
<aside class="sidebar" id="sidebar">
<div class="sidebar__header">
<a class="header__logo" href="https://brix365.com/en/help">
<img src="./logo-light-en.svg">
<a class="header__logo" href="https://elma365.com/ru/help">
<img src="./logo-light.svg">
</a>
<span class="sidebar__close elma-365-close" id="close"></span>
</div>
@ -92,15 +94,15 @@
<div class="article-inner">
<div class="content">
<header class="article__header">
<div class="article__bread" style="display:flex; gap:10px;">
<div class="article__bread" style="display:flex; gap:10px;">
<span id="subcategory" class="search-res__item-category search-res__item-category_subcategory subcategory article__badge"></span>
<div class="topic__breadcrumbs">
<p>Low-code designer &gt; <a href="interface_settings.html">Set up interfaces</a> &gt; Widget types &gt; Common widgets / Button</p>
<p>Low-code дизайнер &gt; <a href="interface_settings.html">Создание интерфейсов</a> &gt; Типы виджетов &gt; Простые виджеты / Кнопка</p>
</div>
</div>
<div class="topic__title"><h1 class="p_Heading1"><span class="f_Heading1">Button</span></h1>
<div class="topic__title"><h1 class="p_Heading1"><span class="f_Heading1">Кнопка</span></h1>
</div>
</header>
@ -109,53 +111,54 @@
<a href="#h1-article" class="scroll-top"></a>
</div>
<!-- Placeholder for topic body. -->
<p style="line-height: 1.20; background: #ffffff; margin: 7px 0 16px 0;"><span style="color: #394149;">This widget allows you to add a button to a page, app or task form. You can use a script to define the on-click behavior of the button.</span></p>
<p style="line-height: 1.20; background: #ffffff; margin: 7px 0 16px 0;"><span style="color: #394149;">To configure the widget, drag it from the right-side panel of the <a href="interface_designer.html" class="topiclink">interface designer</a> to the modeling canvas or click </span><span style="font-weight: bold; color: #394149;">+ Widget</span><span style="color: #394149;">. Read more in the <a href="360029250931.html" class="topiclink">Form templates</a> article. In the pop-up window that opens, configure the widget</span><span style="font-size: 15px; font-family: Inter;">’</span><span style="color: #394149;">s settings.</span></p>
<h2 class="p_Heading2"><span class="f_Heading2">Main tab</span></h2>
<p style="line-height: 1.20; background: #ffffff; margin: 7px 0 16px 0;"><img alt="button_main_settings" width="891" height="427" style="margin:0;width:891px;height:427px;border:none" src="button_main_settings.png"/></p>
<p class="p_Normal">Данный виджет позволяет добавить кнопку на страницу, форму приложения или задачи. С помощью скрипта можно определить поведение кнопки при нажатии.</p>
<p style="background: #ffffff;">Чтобы разместить виджет, перетащите его с правой панели <span style="color: #394149;"><a href="interface_designer.html" class="topiclink">дизайнера интерфейсов</a></span> на поле для моделирования или нажмите кнопку <span style="font-weight: bold;">+ Виджет</span>. Подробнее читайте в статье <a href="360029250931.html" class="topiclink">«Шаблон формы»</a>. Затем выполните настройку в открывшемся окне.</p>
<h2 class="p_Heading2"><span class="f_Heading2">Вкладка </span><span style="font-size: 15px; color: #394149;">«</span><span class="f_Heading2">Основные</span><span style="font-size: 15px; color: #394149;">»</span></h2>
<p class="p_Normal"><img alt="button-widget-1" width="706" height="360" style="margin:0;width:706px;height:360px;border:none" src="button-widget-1.png"/></p>
<ul style="list-style-type:disc">
<li class="p_Normal"><span style="font-family: Inter; font-weight: bold; color: #394149;">Button color</span><span style="font-family: Inter; color: #394149;">. Select what the button will look like.</span></li><li class="p_Normal"><span style="font-family: Inter; font-weight: bold; color: #394149;">Title/Tooltip</span><span style="font-family: Inter; font-weight: bold; color: #ff0000;">*</span><span style="font-family: Inter; color: #394149;">. Add a text that will be shown on the button. You can <a href="common_widget_settings.html#bind-app" class="topiclink">link</a> this field with a context variable by clicking </span><img alt="bind_table-icon" title="bind_table-icon" width="17" height="17" style="margin:0;width:17px;height:17px;border:none" src="bind_table-icon.png"/><span class="f_ImageCaption">.</span></li><li class="p_Normal"><span style="font-family: Inter; font-weight: bold; color: #394149;">Icon</span><span style="font-family: Inter; color: #394149;">. Select an icon to be shown next to the button.</span></li><li class="p_Normal"><span style="font-family: Inter; font-weight: bold; color: #394149;">Hide start form</span><span style="font-family: Inter; color: #394149;">. This option is used for buttons for <a href="button_widget.html#start_process" class="topiclink">launching business processes</a>. Enable it if you don</span><span style="font-size: 15px; font-family: Inter;">’t want</span><span style="font-family: Inter; color: #394149;"> the <a href="360012496011.html#form_tab" class="topiclink">process start form</a> configured in the start event to be displayed upon button click. </span>The process execution will start with the activity placed directly after the start event. You can <a href="common_widget_settings.html#bind-app" class="topiclink">link</a> the field with a context variable by clicking<span style="font-family: Inter; color: #394149;"> </span><img alt="bind_table-icon" title="bind_table-icon" width="17" height="17" style="margin:0;width:17px;height:17px;border:none" src="bind_table-icon.png"/><span class="f_ImageCaption">.</span></li><li class="p_Normal"><span style="font-size: 15px; font-weight: bold; color: #394149;">Action type</span><span style="font-size: 15px; color: #394149;">. Select the action that will take place when a user clicks the button</span>:</li></ul>
<ul style="list-style-type:circle"><ul style="list-style-type:circle">
<li class="p_Normal"><a href="button_widget.html#script" class="topiclink">Run a script</a>. Select a function created on the the <a href="designer-tabs.html#scripts" class="topiclink">Scripts</a> tab or create a new one.</li><li class="p_Normal"><span style="font-size: 15px; color: #394149;"><a href="button_widget.html#preset_action" class="topiclink">Select a preset action</a>. Select one of actions available in the system, for example, </span><span style="font-size: 15px; font-weight: bold; color: #394149;">Restrict access to data</span><span style="font-size: 15px; color: #394149;">.</span></li><li class="p_Normal"><span style="font-size: 15px; color: #394149;"><a href="button_widget.html#start_process" class="topiclink">Start a process</a>. Bind a process to the button to run a process instance.</span></li><li class="p_Normal"><span style="font-size: 15px; color: #394149;"><a href="button_widget.html#create_item" class="topiclink">Create an app item</a>.</span></li><li class="p_Normal"><span style="font-size: 15px; color: #394149;"><a href="button_widget.html#open_link" class="topiclink">Open a link</a>. Configure a link to open when a user click on the button.</span></li></ul></li></ul>
<p class="p_Normal">&nbsp;</p>
<h3 class="p_Heading3"><a id="script" class="hmanchor"></a><span class="f_Heading3">Run a script</span></h3>
<p style="line-height: 1.20;"><span style="font-size: 15px; color: #394149;">When a user clicks the button, a predefined script runs. You can use this option if you need to</span><span style="font-size: 15px; color: #394149;"> display information </span><span style="font-size: 15px; color: #394149;">depending on a certain condition.</span></p>
<p style="line-height: 1.20; margin: 16px 0 16px 0;"><span style="font-size: 15px; color: #394149;">Select a script from the</span><span style="font-size: 15px; color: #394149;"> </span><span style="font-size: 15px; color: #394149;"><a href="designer-tabs.html#scripts" class="topiclink">Scripts</a> tab. You can also move to creating a script by clicking </span><span style="font-size: 15px; font-weight: bold; color: #394149;">Create</span><span style="font-size: 15px; color: #394149;">, entering the function</span><span style="font-size: 15px; font-family: Inter;">’s name, and clicking </span><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Open</span><span style="font-size: 15px; font-family: Inter;">. </span><span style="font-size: 15px; color: #394149;">Read more about creating client and server scripts in the</span><span style="font-size: 15px; color: #394149;"> </span><span style="font-size: 15px; color: #394149;"><a href="client_server_scripts.html" class="topiclink">Scripts in widgets</a> article</span><span style="font-size: 15px; color: #394149;">.</span></p>
<h3 class="p_Heading3"><a id="preset_action" class="hmanchor"></a><span class="f_Heading3">Run a preset action</span></h3>
<p class="p_Normal">When a user clicks the button, a preset action runs. Select the action in the field below. Note that this option is not available for pages.</p>
<p class="p_Normal">Actions available for all types of apps:</p>
<li class="p_Normal"><span style="font-weight: bold;">Отображение</span> — выберите внешний вид виджета;</li><li class="p_Normal"><span style="font-weight: bold;">Надпись</span>/<span style="font-weight: bold;">подсказка</span><span style="font-weight: bold; color: #ff0000;">*</span> — укажите текст надписи или подсказки, отображаемый на кнопке. Вы можете <a href="common_widget_settings.html#bind_field" class="topiclink">связать</a> это поле с контекстной переменной, нажав <img alt="bind_table-icon" width="19" height="20" style="margin:0;width:19px;height:20px;border:none" src="bind_table-icon.png"/>;</li><li class="p_Normal"><span style="font-weight: bold;">Иконка</span> — вы можете выбрать иконку, отображаемую вместе с надписью на кнопке;</li><li class="p_Normal"><span style="font-weight: bold;">Не показывать стартовую форму</span> — <span style="font-size: 13px; font-family: Inter;">опция отображается для кнопок, связанных с </span><span style="font-size: 13px; font-family: Inter; color: #0563c1;"><a href="button_widget.html#start-process" class="topiclink">запуском бизнес-процесса</a></span><span style="font-size: 13px; font-family: Inter; color: #394149;">. </span><span style="font-size: 13px; font-family: Inter;">Включите её, чтобы при нажатии на кнопку настроенная в стартовом событии </span><span style="font-size: 13px; font-family: Inter; color: #0563c1;"><a href="360012496011.html#form_tab" class="topiclink">форма запуска</a></span><span style="font-size: 13px; font-family: Inter;"> не отображалась. Исполнение процесса начнётся с блока, следующего за стартовым событием</span>. Вы можете <a href="common_widget_settings.html#bind_field" class="topiclink">связать</a> это поле с контекстной переменной, нажав <img alt="bind_table-icon" width="19" height="20" style="margin:0;width:19px;height:20px;border:none" src="bind_table-icon.png"/>;</li><li class="p_Normal"><span style="font-weight: bold;">Тип действия</span> — выберите действие, которое выполнится, когда пользователь нажмёт кнопку:<ul style="list-style-type:circle">
<li class="p_Normal"><a href="button_widget.html#script" class="topiclink">Скрипт</a> — выберите готовый скрипт, написанный на вкладке <a href="designer-tabs.html#script-tab" class="topiclink">Скрипты</a>, или создайте его; </li><li class="p_Normal"><a href="button_widget.html#activity" class="topiclink">Предопределенное действие</a> — выберите настроенное в системе действие, например, <span style="font-weight: bold;">Настройка прав доступа</span>;</li><li class="p_Normal"><a href="button_widget.html#start-process" class="topiclink">Запустить процесс</a> — свяжите кнопку с запуском экземпляра настроенного в системе процесса;</li><li class="p_Normal"><a href="button_widget.html#create-app-item" class="topiclink">Создать элемент приложения</a>; </li><li class="p_Normal"><a href="button_widget.html#link" class="topiclink">Ссылка</a> — настройте переход по ссылке.</li></ul></li></ul>
<h3 class="p_Heading3"><a id="script" class="hmanchor"></a><span class="f_Heading3">Скрипт</span></h3>
<p class="p_Normal">Когда пользователь нажмёт кнопку, выполнится заданный скрипт. Используйте эту опцию, например, чтобы отобразить информацию в зависимости от тех или иных условий.</p>
<p class="p_Normal">Выберите скрипт, уже написанный на вкладке <a href="designer-tabs.html#script-tab" class="topiclink">Скрипты</a>. Также вы можете перейти к созданию скрипта на этой вкладке. Для этого нажмите кнопку <span style="font-weight: bold;">Создать</span>, введите название функции и затем нажмите <span style="font-weight: bold;">Открыть</span>. Подробнее о создании скрипта на стороне <span style="font-weight: bold;">Клиента</span> или <span style="font-weight: bold;">Сервера</span> читайте в статье <a href="client_server_scripts.html" class="topiclink">«Скрипты в виджетах»</a>.</p>
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample">начало&nbsp;внимание</span></p>
<p class="p_Normal">Использование констант <code><b>Global</b></code> или <code><b>Namespace</b></code> в скриптах ограничивает экспорт компонентов системы. Подробнее об этом читайте в статье <a href="global-constants.html#export-restrictions" class="topiclink">«Глобальные константы в скриптах»</a>.</p>
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample">конец&nbsp;внимание</span></p>
<h3 class="p_Heading3"><a id="activity" class="hmanchor"></a><span class="f_Heading3">Предопределённое действие</span></h3>
<p class="p_Normal">Когда пользователь нажмёт кнопку, выполнится уже настроенное в системе действие. Выберите его в поле <span style="font-weight: bold;">Предопределенное действие</span>. При настройке страницы эта опция не применяется.</p>
<p class="p_Normal">Для любых приложений доступно действие:</p>
<ul style="list-style-type:disc">
<li class="p_Normal"><span style="font-weight: bold;">Access settings</span>.<span style="font-weight: bold;"> </span>The user can change the access permissions for app items. This is only available if you have enabled the <span style="font-weight: bold;">Restrict access to data</span> option in the app<span style="font-size: 15px; font-family: Inter;">’</span>s settings.</li></ul>
<p class="p_Normal">Actions available for <span style="font-weight: bold;">Document</span> type apps:</p>
<li class="p_Normal"><span style="font-weight: bold;">Настройка прав доступа</span> — пользователь сможет изменить права доступа на элемент приложения. Для этого в настройках самого приложения должна быть выбрана опция <span style="font-weight: bold;">Ограничить доступ к данным</span>.</li></ul>
<p class="p_Normal">Для приложений типа <span style="font-weight: bold;">Документ</span> доступны действия:</p>
<ul style="list-style-type:disc">
<li class="p_Normal"><span style="font-weight: bold;">Add version</span>.<span style="font-weight: bold;"> </span>Upload a new version of the document.</li><li class="p_Normal"><span style="font-weight: bold;">Send</span>. Send the document for approval or for information.</li><li class="p_Normal"><span style="font-weight: bold;">Version list</span>. Open a list of all the file<span style="font-size: 15px; font-family: Inter;">’</span>s versions.</li></ul>
<p class="p_Normal">Actions available for business process tasks:</p>
<li class="p_Normal"><span style="font-weight: bold;">Добавить версию</span> — позволяет загрузить файл с новой версией документа;</li><li class="p_Normal"><span style="font-weight: bold;">Отправить</span> — нажав на кнопку, пользователь может отправить документ на ознакомление или на согласование;</li><li class="p_Normal"><span style="font-weight: bold;">Список версий</span> — позволяет открыть список версий файла при нажатии на кнопку.</li></ul>
<p class="p_Normal">Для задач бизнес-процесса доступны действия:</p>
<ul style="list-style-type:disc">
<li class="p_Normal"><span style="font-weight: bold;">Reassign task</span>. Reassign the task to someone else.</li><li class="p_Normal"><span style="font-weight: bold;">Task menu</span>.  Open the task<span style="font-size: 15px; font-family: Inter;">’</span>s menu with available actions:<ul style="list-style-type:circle">
<li class="p_Normal"><span style="font-weight: bold;">Reassign</span>.</li><li class="p_Normal"><span style="font-weight: bold;">Change the participants list</span>.</li><li class="p_Normal"><span style="font-weight: bold;">Change start date</span>.</li><li class="p_Normal"><span style="font-weight: bold;">Schedule in the calendar</span>.</li><li class="p_Normal"><span style="font-weight: bold;">Reschedule in the calendar</span>.</li><li class="p_Normal"><span style="font-weight: bold;">Change task progress</span>.</li></ul></li></ul>
<h3 class="p_Heading3"><a id="start_process" class="hmanchor"></a><span class="f_Heading3">Start a process </span></h3>
<p class="p_Normal">When a user clicks the button, a process starts. For illustration, let<span style="font-size: 15px; font-family: Inter;">’</span>s set up the start of the approval process on the <span style="font-weight: bold;">Contracts</span> app item page:</p>
<li class="p_Normal"><span style="font-weight: bold;">Переназначить задачу</span> — позволяет пользователю переназначить задачу на другого сотрудника;</li><li class="p_Normal"><span style="font-weight: bold;">Меню задачи</span> — открывает меню задачи с действиями:<ul style="list-style-type:circle">
<li class="p_Normal"><span style="font-weight: bold;">Переназначить</span>;</li><li class="p_Normal"><span style="font-weight: bold;">Изменить список участников</span>;</li><li class="p_Normal"><span style="font-weight: bold;">Изменить дату начала</span>;</li><li class="p_Normal"><span style="font-weight: bold;">Запланировать в Календарь</span>;</li><li class="p_Normal"><span style="font-weight: bold;">Изменить время в Календаре</span>;</li><li class="p_Normal"><span style="font-weight: bold;">Изменить процент выполнения</span>.</li></ul></li></ul>
<h3 class="p_Heading3"><a id="start-process" class="hmanchor"></a><span class="f_Heading3">Запустить процесс </span></h3>
<p class="p_Normal">Когда пользователь нажмёт кнопку, запустится процесс. Для примера настроим запуск процесса согласования с формы элемента приложения <span style="font-weight: bold;">Договор</span>:</p>
<ol style="list-style-type:decimal">
<li value="1" class="p_Normal">In the <span style="font-weight: bold;">Business process</span><span style="font-weight: bold; color: #ff0000;">*</span> field, select the approval process.</li><li value="2" class="p_Normal">In the <span style="font-weight: bold;">Link to field</span> field, select the <span style="font-weight: bold;">Contract</span> variable. It will store the current item of the <span style="font-weight: bold;">Contracts</span> app.</li><li value="3" class="p_Normal">Next, you can add certain contract data to the process: its number, date created, counterparty, etc. To do that, click <span style="font-weight: bold;">Configure input parameters</span>.</li><li value="4" class="p_Normal">In the provided window, map the process variables with the <span style="font-weight: bold;">Contracts</span> app properties. In the left column, select the process context properties that you want to fill in. In the right column select the <span style="font-weight: bold;">Contracts</span> app properties that you want to send to the process.</li></ol>
<p class="p_Normal"><span style="color: #394149;">You can also enable the </span><span style="font-weight: bold; color: #394149;">Show pop-over next to the button</span><span style="color: #394149;"> option. In this case, when the user clicks on the button, a pop-over window opens where the user can enter the process instance name and run it.</span></p>
<h3 class="p_Heading3"><a id="create_item" class="hmanchor"></a><span class="f_Heading3">Create an app item</span></h3>
<p class="p_Normal">When a user clicks the button<span style="color: #394149;">, a form for creating a new app item opens. Some fields on this form can be automatically pre-filled to save time and avoid human error. To do that, fill out the input parameters.</span></p>
<p class="p_Normal">For example, let<span style="font-size: 15px; font-family: Inter;">’</span>s set up a button on the <span style="font-weight: bold;">Contracts</span> app item page<span style="color: #394149;">. We want a new acceptance certificate to be created when we click on the button. The </span><span style="font-weight: bold; color: #394149;">Contract</span><span style="color: #394149;"> field will be pre-filled with the current contract. To set this up, make sure that that there is an </span><span style="font-weight: bold; color: #394149;">App</span><span style="color: #394149;"> type field on the </span><span style="font-weight: bold; color: #394149;">Acceptance Certificates</span><span style="color: #394149;"> app form for storing the contract. Then configure the button:</span></p>
<li value="1" class="p_Normal">В поле <span style="font-weight: bold;">Бизнес-процесс</span><span style="font-weight: bold; color: #ff0000;">*</span> выберите процесс согласования.</li><li value="2" class="p_Normal">В настройке <span style="font-weight: bold;">Связать с полем</span> выберите переменную <span style="font-weight: bold;">Договор</span>. В неё запишется текущий элемент приложения <span style="font-weight: bold;">Договор</span>.</li><li value="3" class="p_Normal">Затем вы можете передать в процесс данные договора — его номер, дату создания, контрагента. Для этого нажмите <span style="font-weight: bold;">Настроить входные параметры</span>.</li><li value="4" class="p_Normal">В открывшемся окне сопоставьте переменные процесса и свойства приложения <span style="font-weight: bold;">Договор</span>. В левой колонке выберите свойства контекста процесса, которые хотите заполнить, а в правой колонке выберите свойства <span style="font-weight: bold;">Договора</span>, которые хотите передать в процесс.</li></ol>
<p class="p_Normal"><span style="color: #394149;">Вы также можете активировать опцию </span><span style="font-weight: bold; color: #394149;">Рисовать форму рядом с кнопкой</span><span style="color: #394149;">. Тогда при нажатии на кнопку откроется дополнительное окно, где пользователь сможет указать название экземпляра процесса и запустить его.</span></p>
<h3 class="p_Heading3"><a id="create-app-item" class="hmanchor"></a><span class="f_Heading3">Создать элемент приложения</span></h3>
<p class="p_Normal"><span style="color: #394149;">Когда пользователь нажмёт кнопку, откроется форма создания нового элемента. Часть полей на этой форме можно заполнить автоматически, чтобы сэкономить время пользователя и избежать ошибок. Для этого заполните входные параметры.</span></p>
<p class="p_Normal"><span style="color: #394149;">Для примера настроим кнопку на форме договора. Допустим, при нажатии на кнопку должен создаваться новый акт. При этом нужно, чтобы на форме акта в поле </span><span style="font-weight: bold; color: #394149;">Договор</span><span style="color: #394149;"> был указан договор, на карточке которого пользователь нажал кнопку. Для этого сначала убедитесь, что на форме акта есть поле типа </span><span style="font-weight: bold; color: #394149;">Приложение</span><span style="color: #394149;">, в котором будет храниться договор. Затем настройте кнопку:</span></p>
<ol style="list-style-type:decimal">
<li value="1" class="p_Normal">In the <span style="font-weight: bold;">App</span> field, select <span style="font-weight: bold;">Acceptance Certificate</span>.</li><li value="2" class="p_Normal">In <span style="font-weight: bold;">Link to field</span> select the <span style="font-weight: bold;">Contract</span> property that will be added to the current <span style="font-weight: bold;">Contract</span> app item.</li><li value="3" class="p_Normal">Then you can send contract details to the acceptance certificate: the serial number, date created, counterparty. To do that, click <span style="font-weight: bold;">Configure input parameters</span>.</li><li value="4" class="p_Normal">In the provided window map the properties of the <span style="font-weight: bold;">Acceptance Certificates</span> and <span style="font-weight: bold;">Contracts</span> apps. In the left column, you can select the <span style="font-weight: bold;">Certificate number</span> field that you want to fill out. In the right column select the <span style="font-weight: bold;">Contract number</span> field that you want to pass to the acceptance certificate.</li></ol>
<p class="p_Normal"><img alt="button_widget-2" width="682" height="355" style="margin:0;width:682px;height:355px;border:none" src="button_widget-2.png"/></p>
<p class="p_Normal"><span style="font-weight: bold;">Note</span>: you can only map fields of the same type: a <span style="font-weight: bold;">String</span> type field with another <span style="font-weight: bold;">String</span> field, a <span style="font-weight: bold;">Number</span> type field with another <span style="font-weight: bold;">Number</span> field, and so on.</p>
<p class="p_Normal"><span style="color: #394149;">Now, when a user clicks on this button, the form for creating a new acceptance certificate will open. The </span><span style="font-weight: bold; color: #394149;">Contract</span><span style="color: #394149;"> field will store the contract</span> from the page of which the user clicked the button. The <span style="font-weight: bold;">Certificate number</span> field will be pre-filled with the contract<span style="font-size: 15px; font-family: Inter;">’</span>s serial number.</p>
<h3 class="p_Heading3"><a id="open_link" class="hmanchor"></a><span class="f_Heading3">Open a link</span></h3>
<p class="p_Normal">When a user clicks the button, a link opens.</p>
<p class="p_Normal">You can link the button to a <span style="font-weight: bold;">Text</span> context property. For example, for users can open instructions or company policies. To set the link up, click <img alt="bind_table-icon" width="21" height="21" style="margin:0;width:21px;height:21px;border:none" src="bind_table-icon.png"/>, then click <span style="font-weight: bold;">&lt;Not defined&gt;</span> and select the text variable in the list.</p>
<p class="p_Normal">You can also enable the <span style="font-weight: bold;">Open the link in a new tab</span> option.</p>
<h2 class="p_Heading2"><span class="f_Heading2">Events and System tab </span></h2>
<p class="p_Normal">These tabs are similar for all the widgets: visibility and access settings, on-click behavior and so on. To learn more, see <a href="common_widget_settings.html" class="topiclink">System widget settings</a>.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><span style="font-size: 13px; font-family: Inter; color: #394149;">To finish configuration, click </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Save</span><span style="font-size: 13px; font-family: Inter; color: #394149;">. To make the form available to users, click </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Save</span><span style="font-size: 13px; font-family: Inter; color: #394149;"> and </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Publish</span><span style="font-size: 13px; font-family: Inter; color: #394149;"> in the designer</span><span style="font-size: 15px; font-family: Inter;">’</span><span style="font-size: 13px; font-family: Inter; color: #394149;">s toolbar.</span></p>
<h2 class="p_Heading2"><span class="f_Heading2">Example</span></h2>
<p class="p_Normal">In the following example, the configured button widget allows the user to discard all changes. </p>
<p style="line-height: 1.20; margin: 7px 0 7px 0;"><img alt="But2" width="623" height="230" style="margin:0;width:623px;height:230px;border:none" src="but2.png"/></p>
<li value="1" class="p_Normal">В поле <span style="font-weight: bold;">Приложение</span> выберите <span style="font-weight: bold;">Акт</span>.</li><li value="2" class="p_Normal">В настройке <span style="font-weight: bold;">Связать с полем</span> выберите свойство <span style="font-weight: bold;">Договор</span>, в которое запишется текущий элемент приложения <span style="font-weight: bold;">Договор</span>.</li><li value="3" class="p_Normal">Затем вы можете передать в акт данные договора — его номер, дату создания, контрагента. Для этого нажмите <span style="font-weight: bold;">Настроить входные параметры</span>.</li><li value="4" class="p_Normal">В открывшемся окне сопоставьте свойства приложений <span style="font-weight: bold;">Акт</span> и <span style="font-weight: bold;">Договор</span>. Так, в левой колонке выберите свойство <span style="font-weight: bold;">Номер акта</span>, которое хотите заполнить, а в правой колонке выберите свойство <span style="font-weight: bold;">Номер договора</span>, которое хотите передать.</li></ol>
<p class="p_Normal"><img alt="кнопка 1" width="868" height="475" style="margin:0;width:868px;height:475px;border:none" src="hmfile_hash_5ff9ee73.png"/></p>
<p class="p_Normal"><span style="font-weight: bold;">Важно</span>: связывать можно только поля одинакового типа, например, поле типа <span style="font-weight: bold;">Строка</span> — с полем такого же типа <span style="font-weight: bold;">Строка</span>, поле типа <span style="font-weight: bold;">Число</span> — с полем такого же типа <span style="font-weight: bold;">Число</span>.</p>
<p class="p_Normal"><span style="color: #394149;">Теперь при нажатии на кнопку откроется форма создания</span> элемента приложения <span style="font-weight: bold;">Акт</span>. В поле <span style="font-weight: bold;">Договор</span> будет записан элемент приложения <span style="font-weight: bold;">Договор</span>, на форме которого пользователь нажал кнопку. В поле <span style="font-weight: bold;">Номер акта</span> будет указан номер договора.</p>
<h3 class="p_Heading3"><a id="link" class="hmanchor"></a><span class="f_Heading3">Ссылка</span></h3>
<p class="p_Normal">Когда пользователь нажмёт кнопку, осуществится переход по ссылке.</p>
<p class="p_Normal">Вы можете связать кнопку со свойством контекста типа <span style="font-weight: bold;">Текст</span>. Например, чтобы настроить переход к тексту инструкции, выберите <img alt="bind_table-icon" width="19" height="20" style="margin:0;width:19px;height:20px;border:none" src="bind_table-icon.png"/>, затем нажмите <span style="font-weight: bold;">&lt;Не установлено&gt;</span> и в выпадающем списке выберите переменную <span style="font-weight: bold;">Текст инструкции</span>.</p>
<p style="margin: 7px 0 16px 0;">Также можно включить опцию <span style="font-weight: bold;">Открывать ссылку в новой вкладке</span>.</p>
<h2 class="p_Heading2"><span class="f_Heading2">Вкладки «События» и «Системные»</span></h2>
<p class="p_Normal">На этих вкладках задаются системные настройки, одинаковые для всех виджетов. Они позволяют управлять видимостью виджетов и доступом к ним, настраивать их поведение при наведении курсора и т. д. Подробнее об этом читайте в статье <a href="common_widget_settings.html" class="topiclink">«Системные настройки виджетов»</a>.</p>
<p class="p_Normal">Для завершения настройки виджета нажмите кнопку <span style="font-weight: bold;">Сохранить</span>. Чтобы настроенная форма стала доступна пользователям, нажмите <span style="font-weight: bold;">Сохранить</span> и <span style="font-weight: bold;">Опубликовать </span>на верхней панели дизайнера интерфейсов.</p>
<h2 class="p_Heading2"><span class="f_Heading2">Пример</span></h2>
<p class="p_Normal">Например, вы можете добавить кнопку, позволяющую отменить внесённые изменения. </p>
<p class="p_Normal"><img alt="кнопка пример" width="783" height="250" style="margin:0;width:783px;height:250px;border:none" src="hmfile_hash_726c4e8c.png"/></p>
<div class="bottom-nav">
@ -172,7 +175,7 @@
</div>
<!-- добавляет на страницу строку блок Была ли статья полезной? -->
<div class="feedback" id="feedback"><div class="feedback-help"><span><b>Was this helpful?</b></span><form action="" method="POST" class="feedback-form" id="feedback-form"><div class="feedback__popup feedback__popup-response" id="feedback__popup_thx" style="display: none;">Thanks for your feedback!</div><div class="feedback__popup" id="feedback__popup_why" style="display: none;"><div class="feedback__popup-header">Please specify why:</div><input type="radio" name="category" id="bad_recommendation" value="bad_recommendation"><label for="bad_recommendation">Recommendations did not help me</label><input type="radio" name="category" id="difficult_text" value="difficult_text"><label for="difficult_text">Article is hard to understand</label><input type="radio" name="category" id="no_answer" value="no_answer"><label for="no_answer">Didn`t answer my question</label><input type="radio" name="category" id="bad_header" value="bad_header"><label for="bad_header">Content does not match the topic</label><input type="radio" name="category" id="other_reason" value="other_reason"><label for="other_reason">Other</label></div><div class="feedback__popup" id="feedback__popup-other" style="display: none;"><div class="feedback__popup-header">How we can improve it?</div><textarea class="feedback__textarea" name="other" id=""></textarea><input type="submit" class="feedback__other-btn" value="Submit"></div><div class="feedback-form__btn-group"><input type="radio" name="useful" id="feedback__useful_yes" value="true"><label for="feedback__useful_yes"><img src="like.svg" class="small-img" alt="like"><spanclass="feedback-form__btn-group_yes-btn">Yes</spanclass="feedback-form__btn-group_yes-btn"></label><input type="radio" name="useful" id="feedback__useful_no" value="false"><label for="feedback__useful_no"><img src="dislike.svg" class="small-img" alt="dislike"><spanclass="feedback-form__btn-group_no-btn">No</spanclass="feedback-form__btn-group_no-btn"></label></div><select name="category"><option disabled="">Please specify why</option><option value="bad_recommendation" selected="">Recommendations did not help me</option><option value="difficult_text">Article is hard to understand</option><option value="no_answer">Didn`t answer my question</option><option value="bad_header">Content does not match the topic</option><option value="other_reason">Other</option></select><input type="submit"></form></div><div class="found_typo"><p style="margin: 0px; margin-top: 16px !important;"><span><b>Found a typo?</b></span> Select it and press <i>Ctrl+Enter</i> to send us feedback</p></div></div>
<div class="feedback-wrap"><div class="feedback" id="feedback"><span><b>Была ли статья полезной?</b></span><form action="" method="POST" class="feedback-form" id="feedback-form"><div class="feedback__popup feedback__popup-response" id="feedback__popup_thx">Спасибо за ваш отзыв!</div><div id="feedback-success-popup"><div class="wrap"><button type="button" class="feedback-popup-close">×</button><svg width="44" height="44" viewBox="0 0 44 44" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_212_2187)"><path d="M22 0.6875C10.2294 0.6875 0.6875 10.2294 0.6875 22C0.6875 33.7706 10.2294 43.3125 22 43.3125C33.7706 43.3125 43.3125 33.7706 43.3125 22C43.3125 10.2294 33.7706 0.6875 22 0.6875ZM22 40.5625C11.8023 40.5625 3.4375 32.3078 3.4375 22C3.4375 11.8024 11.6922 3.4375 22 3.4375C32.1977 3.4375 40.5625 11.6922 40.5625 22C40.5625 32.1976 32.3078 40.5625 22 40.5625ZM34.1713 16.933L18.6613 32.3186C18.257 32.7197 17.604 32.7171 17.203 32.3128L9.82283 24.873C9.42176 24.4686 9.42434 23.8157 9.82867 23.4146L10.5609 22.6884C10.9652 22.2873 11.6181 22.2899 12.0192 22.6942L17.9468 28.6697L31.9926 14.7366C32.3969 14.3356 33.0498 14.3382 33.4509 14.7425L34.1772 15.4747C34.5783 15.879 34.5757 16.532 34.1713 16.933Z" fill="#27AE60"></path></g><defs><clipPath id="clip0_212_2187"><rect width="44" height="44" fill="white"></rect></clipPath></defs></svg><p>Ваш отзыв успешно отправлен!</p><span>Спасибо за обратную связь.</span></div></div><div class="feedback__popup" id="feedback__popup_why"><button type="button" class="feedback-popup-close">×</button><div class="feedback__popup-header">Уточните, почему:</div><input type="radio" name="category" id="bad_recommendation" value="bad_recommendation"><label for="bad_recommendation">Рекомендации не помогли</label><input type="radio" name="category" id="difficult_text" value="difficult_text"><label for="difficult_text">Текст трудно понять</label><input type="radio" name="category" id="no_answer" value="no_answer"><label for="no_answer">Нет ответа на мой вопрос</label><input type="radio" name="category" id="bad_header" value="bad_header"><label for="bad_header">Содержание статьи не соответствует заголовку</label><input type="radio" name="category" id="other_reason" value="other_reason"><label for="other_reason">Другая причина</label></div><div class="feedback__popup" id="feedback__popup-other"><button type="button" class="feedback-popup-close">×</button> <div class="feedback__popup-header">Расскажите, что вам не понравилось в статье:</div><textarea class="feedback__textarea" name="other" id=""></textarea><input type="submit" class="feedback__other-btn" value="Отправить"></div><div class="feedback-form__btn-group"><input type="radio" name="useful" id="feedback__useful_yes" value="true"><label for="feedback__useful_yes"><img src="like.svg"/><span class="feedback-form__btn-group_yes-btn">Да</span></label><input type="radio" name="useful" id="feedback__useful_no" value="false"><label for="feedback__useful_no"><img src="dislike.svg"/><span class="feedback-form__btn-group_no-btn">Нет</span></label></div><select name="category"><option disabled>Выберите вариант</option><option value="bad_recommendation" selected>Рекомендации не помогли</option><option value="difficult_text">Текст трудно понять</option><option value="no_answer">Нет ответа на мой вопрос</option><option value="bad_header">Содержание статьи не соответствует заголовку</option><option value="other_reason">Другая причина</option></select><input type="submit"></form></div></div>
</section>
</div>
@ -180,7 +183,7 @@
<input type="checkbox" />
<div class="article__arrow"></div>
<div class="table-of-contents elma365-right" id="toc2Content">
<h3 class="h3-toc">In this topic</h3>
<h3 class="h3-toc">В этой статье</h3>
<nav id="toc2"></nav>
</div>
</aside>
@ -191,30 +194,63 @@
<div class="footer-container">
<div class="footer-mobile">
<ul class="footer-mobile__list"><li><a href="https://brix365.com/en/" target="_blank">BRIX</a></li><li><a href="https://tssdk.brix365.com/en/latest/" target="_blank">SDK</a></li><li><a href="https://api.brix365.com/en/" target="_blank">API</a></li></ul><ul class="footer-mobile__list"><li><a href="https://brix365.com/en/help/platform/get-trial.html">Platform</a></li><li><a href="https://brix365.com/en/help/ecm/ecm-functions.html">ECM</a></li><li><a href="https://brix365.com/en/help/service/service-functions.html">Service</a></li><li><a href="https://brix365.com/en/help/projects/projects-functions.html">Projects</a></li></ul>
<ul class="footer-mobile__list"><li><a href="https://api.elma365.com/ru/" target="_blank">API</a></li><li><a href="https://tssdk.elma365.com/" target="_blank">TS SDK</a></li><li><a href="https://community.elma365.com/" target="_blank">Community</a></li><li><a href="https://elma-academy.com/ru/elma365" target="_blank">Академия</a></li></ul><ul class="footer-mobile__list"><li><a href="https://elma365.com/ru/help/platform/get-trial.html">Платформа</a></li><li><a href="https://elma365.com/ru/help/ecm/ecm-functions.html">ECM</a></li><li><a href="https://elma365.com/ru/help/service/service-functions.html">Service</a></li><li><a href="https://elma365.com/ru/help/projects/projects-functions.html">Проекты</a></li></ul>
</div>
<div class="footer-wrap">
<div><span class="mobile-question-popup">Send feedback</span><form method="POST" action class="question__popup question-xs" id="question__popup"><div class="question-wrap"><span class="close"></span><span class="title">Ask a question</span><label for="help_question" style="display: none;"></label><textarea name="help_question" id="help_question"></textarea><input type="submit" value="Send"></div></form><div class="hidden fade-in question-success-xs">Sent</div></div>
<div class="footer-flex-b">
<span class="footer-copy">&copy; 2025 BRIX</span>
<ul class="footer-list">
<li class="footer-item">
<a href="#" class="arrow-top" style="display: block;"></a>
</li>
</ul>
<div class="container">
<div class="footer-wrap">
<div><span class="mobile-question-popup">Отправить фидбэк</span><form method="POST" action class="question__popup question-xs" id="question__popup"><div class="question-wrap"><span class="close"></span><span class="title">Задать вопрос</span><label for="help_question" style="display: none;"></label><textarea name="help_question" id="help_question"></textarea><input type="submit" value="Отправить"></div></form><div class="hidden fade-in question-success-xs">Ваш фидбэк отправлен.</div></div>
<div class="footer-flex-b">
<div class="footer-top">
<span class="footer-copy">&copy; 2025
ELMA365
</span>
<a href="https://navigator.sk.ru/orn/1122971" target="_blank">
<img src="sk-resident.svg" alt="sk icon" class="footer-img" width="117" height="34">
</a>
</div>
<div class="footer-line">
<div class="footer-line-copy">
<span class="footer-copy">&copy; 2025
ELMA365
</span>
</div>
<ul class="footer-list">
<li class="footer-item"><a href="https://elma365.com/ru/" target="_blank" class="footer-link" style="color: #0D4A75;"><img src="browse.svg" alt="browse icon" class="footer-img">elma365.com</a></li><li class="footer-item"><a href="https://www.youtube.com/user/ELMABPM" target="_blank" class="footer-link"><img src="yt.svg" alt="youtube icon" class="footer-img"></a></li><li class="footer-item"><a href="https://vk.com/elma_bpm" target="_blank" class="footer-link"><img src="vk.svg" alt="vk icon" class="footer-img"></a></li><li class="footer-item"><a href="https://t.me/elmaday" target="_blank" class="footer-link"><img src="tg.svg" alt="telegram icon" class="footer-img"></a></li><li class="footer-item"><a href="https://dzen.ru/elma" target="_blank" class="footer-link"><img src="dzen.svg" alt="dzen icon" class="footer-img"></a></li>
<li class="footer-item">
<a href="https://navigator.sk.ru/orn/1122971" target="_blank">
<img src="sk-resident.svg" alt="sk icon" class="footer-img" width="117" height="34">
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<a href="#" class="arrow-top"></a>
</div>
</footer>
<!-- <script type="text/javascript" src="jquery1.min.js"></script>-->
<iframe name="hmnavigation" style="display:none!important"></iframe>
<script src="./jquery-ui.js"></script>
<!--<script src="./jquery-ui.js"></script> -->
<script src="./jquery-ui.min.js"></script>
<!--script src="//cdn.jsdelivr.net/npm/featherlight@1.7.14/release/featherlight.min.js" type="text/javascript" charset="utf-8"></script-->
<script src="./jquery.tocify.min.js"></script>
<script src="./TypoReporter.min.js"></script>