All checks were successful
Deploy Static Site / deploy (push) Successful in 6m6s
216 lines
25 KiB
HTML
216 lines
25 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<title>Calculated fields</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="BRIX can automatically calculate field values on app pages. For instance, it can calculate the total price of an order including VAT or a customer discount. The system can also..." />
|
||
<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="" />
|
||
<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" />
|
||
<link rel="stylesheet" href="./jquery-ui.min.css" />
|
||
<link rel="stylesheet" href="default.css" />
|
||
<link rel="stylesheet" href="./search-yandex.css" />
|
||
<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>
|
||
|
||
<script type="text/javascript" src="highlight.js"></script>
|
||
<script type="text/javascript">
|
||
$(document).ready(function(){highlight();});
|
||
</script>
|
||
</head>
|
||
|
||
<body>
|
||
|
||
<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>
|
||
<!-- <div class="hero__search-form" id="search-panel">
|
||
<form class="search-form" onsubmit="ym(83180416,'reachGoal','poisk')">
|
||
<label class="search-form__label">
|
||
<span id="reset-search" class="search__icon"></span>
|
||
<input class="search-form__input" type="text">
|
||
</label>
|
||
<input class="search-form__submit" type="submit" value="Submit">
|
||
</form>
|
||
</div> -->
|
||
|
||
<div class="hero__search-form" id="search-panel"> <form class="search-form"> <label class="search-form__label"> <span id="reset-search" class="search__icon"></span> <input class="search-form__input" type="text"> </label> <input class="search-form__submit" type="submit" value="Submit"> </form> </div>
|
||
<div class="hero__search">
|
||
<a href="#" id="search-icon" class="hero__search-icon">
|
||
<img src="search-icon-white.svg" alt="search string">
|
||
</a>
|
||
<a href="#" id="side-menu-icon" class="hero__side-icon">
|
||
<img src="side_menu.svg" alt="side menu">
|
||
</a>
|
||
</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>
|
||
|
||
|
||
</div>
|
||
</div>
|
||
|
||
</header>
|
||
|
||
|
||
|
||
|
||
<main class="main container">
|
||
|
||
<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>
|
||
<span class="sidebar__close elma-365-close" id="close"></span>
|
||
</div>
|
||
<div class="sidebar__wrapper" id="side-menu">
|
||
|
||
</div>
|
||
</aside>
|
||
|
||
<article class="article" id="article">
|
||
<div class="article-inner">
|
||
<div class="content">
|
||
<header class="article__header">
|
||
<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 > <a href="create_form.html">Custom forms</a> / Calculated fields</p>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="topic__title"><h1 class="p_Heading1" style="text-align: center; line-height: 1.20; margin: 19px 0 19px 0;"><span class="f_Heading1" style="font-size: 32px;">Calculated fields</span></h1>
|
||
</div>
|
||
|
||
</header>
|
||
<section class="article__content">
|
||
<div class="scroll-top-inner">
|
||
<a href="#h1-article" class="scroll-top"></a>
|
||
</div>
|
||
<!-- Placeholder for topic body. -->
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;">BRIX can automatically calculate field values on app pages. For instance, it can calculate the total price of an order including VAT or a customer discount. The system can also show or hide particular fields depending on conditions.</p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;">These options become available when you switch to the <a href="360028941032.html" class="topiclink">Advanced Mode</a> form editing. Go to the <a href="360028941112.html" class="topiclink">Context</a> tab and click on the property you want to set up. In the provided settings window check the <span style="font-weight: bold;">Set a formula for the field</span> box or <span style="font-weight: bold;">Show only when a condition is met</span>.</p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;"><img alt="CF1" width="570" height="600" style="margin:0;width:570px;height:600px;border:none" src="cf1.png"/></p>
|
||
<p class="p_Normal">Let<span style="font-size: 15px; font-family: Inter;">‘</span>s take a look at how these settings work. </p>
|
||
<h2 class="p_Heading2"><span class="f_Heading2">Set a formula for the field</span></h2>
|
||
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample">начало внимание</span></p>
|
||
<p style="line-height: 1.28; margin: 0 0 11px 0;">This option is only available for <span style="font-weight: bold;">String</span>, <span style="font-weight: bold;">Number</span>, and <span style="font-weight: bold;">Money</span> field types<span style="font-family: Inter;">.</span></p>
|
||
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample">конец внимание</span></p>
|
||
<p class="p_Normal">If the <span style="font-weight: bold;">Set a formula</span> <span style="font-weight: bold; color: #394149;">for the field</span><span style="font-size: 15px; color: #394149;"> option is enabled, the </span><span style="font-size: 15px; font-weight: bold; color: #394149;">Formula</span><span style="font-weight: bold; color: #ff0000;">*</span><span style="font-size: 15px; color: #394149;"> field appears. </span><span style="font-size: 15px; color: #394149;">You can add, subtract, calculate and divide the values with the following operators:</span><span style="font-size: 15px; color: #394149;"> </span><span style="font-weight: bold; color: #394149;">+</span><span style="font-size: 15px; color: #394149;">,</span><span style="font-size: 15px; color: #394149;"> </span><span style="font-weight: bold; color: #394149;">-</span><span style="font-size: 15px; color: #394149;">,</span><span style="font-size: 15px; color: #394149;"> </span><span style="font-weight: bold; color: #394149;">*</span><span style="font-size: 15px; color: #394149;">,</span><span style="font-size: 15px; color: #394149;"> </span><span style="font-weight: bold; color: #394149;">/</span><span style="font-size: 15px; color: #394149;">. </span><span style="font-size: 15px; color: #394149;">Use parentheses </span><span style="font-size: 15px; font-weight: bold; color: #394149;">()</span><span style="font-size: 15px; color: #394149;"> to define the order of operations.</span></p>
|
||
<p style="line-height: 1.20; margin: 16px 0 0 0;"><span style="font-size: 15px; color: #394149;">You can add a variable of the same type as the calculated field to the formula. To do that, click</span><span style="font-size: 15px; color: #394149;"> </span><span style="font-weight: bold; color: #394149;">{+}</span><span style="font-size: 15px; color: #394149;"> </span><span style="font-size: 15px; color: #394149;">and select the variable from the list.</span></p>
|
||
<p style="line-height: 1.20; margin: 16px 0 0 0;"><span style="font-size: 15px; color: #394149;">For example, to the formula for a </span><span style="font-size: 15px; font-weight: bold; color: #394149;">String</span><span style="font-size: 15px; color: #394149;"> property, add </span><span style="font-size: 15px; font-weight: bold; color: #394149;">String</span><span style="font-size: 15px; color: #394149;"> type variables. In case of a </span><span style="font-size: 15px; font-weight: bold; color: #394149;">Number</span><span style="font-size: 15px; color: #394149;"> property, use </span><span style="font-size: 15px; font-weight: bold; color: #394149;">Number</span><span style="font-size: 15px; color: #394149;"> type variables in the formula. If you add a variable of a different type, a validation error will occur.</span></p>
|
||
<p style="line-height: 1.20; margin: 16px 0 16px 0;"><span style="font-size: 15px; color: #394149;">The only exception is the </span><span style="font-size: 15px; font-weight: bold; color: #394149;">Money</span><span style="font-size: 15px; color: #394149;"> type. In a formula for a </span><span style="font-size: 15px; font-weight: bold; color: #394149;">Money</span><span style="font-size: 15px; color: #394149;"> type property, you can use the </span><span style="font-weight: bold; color: #394149;">Money*Number</span><span style="font-size: 15px; color: #394149;"> combination, meaning that you can multiply the value of the </span><span style="font-size: 15px; font-weight: bold; color: #394149;">Money</span><span style="font-size: 15px; color: #394149;"> field by the value of the </span><span style="font-size: 15px; font-weight: bold; color: #394149;">Number</span><span style="font-size: 15px; color: #394149;"> field.</span><br />
|
||
<span style="font-size: 15px; color: #394149;"> </span><br />
|
||
<span style="font-size: 15px; color: #394149;">Consider the following example.</span></p>
|
||
<p style="line-height: 1.20; margin: 16px 0 16px 0;">Let<span style="font-size: 15px; font-family: Inter;">‘</span>s say a company sells and delivers heating installations. When an order is made, the sales rep enters all the details into the system: the customer<span style="font-size: 15px; font-family: Inter;">‘</span>s name, the goods purchased, the delivery date, etc. They might also want to enter a discount. Since the discount may vary depending, for instance, on the order<span style="font-size: 15px; font-family: Inter;">‘</span>s size, it is convenient to use a formula to calculate the total amount to be paid. </p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;"><img alt="CF2" width="950" height="651" style="margin:0;width:950px;height:651px;border:none" src="cf2.png"/></p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;">To set up this behavior, open the order form for editing. Go to the <span style="font-weight: bold;">Context</span> tab and create a new <span style="font-weight: bold;">Total with discount</span> property. Select the <span style="font-weight: bold;">Money</span> type since we are calculating the final amount to be paid. </p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;"><img alt="CF3" width="706" height="502" style="margin:0;width:706px;height:502px;border:none" src="cf3.png"/></p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;">Check the <span style="font-weight: bold;">Set a formula for the field</span> box. The required <span style="font-weight: bold;">Formula</span> field will appear. Click on the plus symbol <span style="font-weight: bold;">{+}</span> in the right corner of the line. A list of app fields with pop up. Select the <span style="font-weight: bold;">Total amount </span>variable of the<span style="font-weight: bold;"> Money </span>type<span style="font-weight: bold;"> </span>(this is the right table column, where the total price of the order is calculated before the discount is applied) and the <span style="font-weight: bold;">Discount </span>variable of the <span style="font-weight: bold;">Number</span> type (this is the field where the sales rep enters the discount<span style="font-size: 15px; font-family: Inter;">‘</span>s amount when registering the order).</p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;">Your final formula shall look as follows:</p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;"><img alt="CF4" width="571" height="100" style="margin:0;width:571px;height:100px;border:none" src="cf4.png"/></p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;">Save the changes. Now, when filling in the order form, the sales rep will enter the purchased products, the number of items purchased, and the discount amount. The system will automatically calculate the total amount to be paid minus the discount. </p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;"><img alt="CF5" width="1064" height="763" style="margin:0;width:1064px;height:763px;border:none" src="cf5.gif"/></p>
|
||
<h2 class="p_Heading2" style="line-height: 1.20; margin: 19px 0 0 0;"><span class="f_Heading2" style="font-size: 24px;">Show fields based on conditions</span></h2>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 19px 0 0 0;">Sometimes you need to hide or show fields on the form depending on certain conditions. Let<span style="font-size: 15px; font-family: Inter;">‘</span>s say our company provides different delivery options, including pickup and courier delivery. When a sales rep registers a new order, he or she specifies the delivery method selected by the customer. If the customer has selected courier delivery, an additional address field will appear on the form. In the case of pickup, the field will stay hidden. </p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;"><img alt="CF6" width="1060" height="862" style="margin:0;width:1060px;height:862px;border:none" src="cf6.gif"/></p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;"> To set up this behavior, open the order form for editing. Go to the <a href="360028941112.html" class="topiclink">Context </a>tab and create a new <span style="font-weight: bold;">Delivery address</span> property. Check the <span style="font-weight: bold;">Show only when a condition is met</span> box and then click on the <span style="font-weight: bold;">Set up conditions</span> link. </p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;"><img alt="CF7" width="572" height="574" style="margin:0;width:572px;height:574px;border:none" src="cf7.png"/></p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;">In the pop-up, you can now set up the show condition for the field. If the conditions are not met, the field will remain hidden. </p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;"><img alt="CF8" width="618" height="225" style="margin:0;width:618px;height:225px;border:none" src="cf8.png"/></p>
|
||
<ul style="list-style-type:disc">
|
||
<li style="line-height: 1.20;"><span style="font-weight: bold;">Operand 1, 2</span>.<span style="font-weight: bold;"> </span>Select a property from the app's context or specify a particular value.</li><li style="line-height: 1.20;"><span style="font-weight: bold;">Operation</span>.<span style="font-weight: bold;"> </span>Select the operator for checking this condition.</li></ul>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;">If you want to set up multiple conditions, you have to link them with logical operators that will be used for checking the conditions. The field will be shown if the result is true.</p>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;">Operators:</p>
|
||
<ul style="list-style-type:disc">
|
||
<li style="line-height: 1.20;"><span style="font-weight: bold;">AND</span>.<span style="font-weight: bold;"> </span>The result is <span style="font-weight: bold;">True</span> if both conditions are met.</li><li style="line-height: 1.20;"><span style="font-weight: bold;">OR</span>.<span style="font-weight: bold;"> </span>The result is <span style="font-weight: bold;">True</span> if at least one of the conditions is met.</li><li style="line-height: 1.20;"><span style="font-weight: bold;">OR NOT</span>.<span style="font-weight: bold;"> </span>The result is <span style="font-weight: bold;">True</span> if at least one of the conditions is not met.</li><li style="line-height: 1.20;"><span style="font-weight: bold;">AND NOT</span>.<span style="font-weight: bold;"> </span>The result is <span style="font-weight: bold;">True</span> if both conditions are not met.</li></ul>
|
||
<p class="p_Normal" style="line-height: 1.20; margin: 14px 0 0 0;">Note that conditions are checked in the order they are listed.</p>
|
||
|
||
<div class="bottom-nav">
|
||
|
||
<a id="prev-link" class="topic__navi_prev" href="360028941272.html">
|
||
<span class="bottom-nav__arrow bottom-nav__arrow--prev"></span> <span
|
||
class="bottom-nav__link">360028941272.html</span>
|
||
</a>
|
||
|
||
|
||
<a id="next-link" class="topic__navi_next" href="360029250931.html">
|
||
<span class="bottom-nav__link">360029250931.html</span> <span
|
||
class="bottom-nav__arrow bottom-nav__arrow--next"></span>
|
||
</a>
|
||
|
||
</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>
|
||
|
||
</section>
|
||
</div>
|
||
<aside class="article__sidebar" style="display:none">
|
||
<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>
|
||
<nav id="toc2"></nav>
|
||
</div>
|
||
</aside>
|
||
</div>
|
||
</article>
|
||
</main>
|
||
<footer class="footer">
|
||
<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>
|
||
|
||
|
||
</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">© 2025 BRIX</span>
|
||
<ul class="footer-list">
|
||
|
||
<li class="footer-item">
|
||
<a href="#" class="arrow-top" style="display: block;"></a>
|
||
</li>
|
||
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</footer>
|
||
<iframe name="hmnavigation" style="display:none!important"></iframe>
|
||
<script src="./jquery-ui.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>
|
||
<script src="./google-search.js"></script>
|
||
<script src="./main.js"></script>
|
||
</body>
|
||
|
||
</html>
|