{"id":3978,"date":"2024-09-11T09:35:32","date_gmt":"2024-09-11T01:35:32","guid":{"rendered":"https:\/\/five.co\/?p=3978"},"modified":"2025-04-24T09:00:41","modified_gmt":"2025-04-24T01:00:41","slug":"calculated-fields","status":"publish","type":"post","link":"https:\/\/preview-php85.dzine.org\/five\/blog\/calculated-fields\/","title":{"rendered":"Advanced Forms: Calculated Fields"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Advanced Forms &#8211; Part 7: Automatically Calculate Fields in A Form <\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Hi and welcome to Five&#8217;s <em><strong>Advanced Forms<\/strong><\/em> series. In this blog post series, we teach you how to design the perfect form in Five. From changing the layout of your form to adding calculated fields &#8211; we cover everything you need to know to give your users access to a custom-designed form that does exactly as needed.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">In this blog post, we introduce <strong>Calculated Fields. <\/strong>A calculated field is a field that is calculated based on input(s) in one or more other form fields. Calculated fields can deal with numeric calculations (additions, subtractions, multiplications, or divisions), or with text manipulation (concatenation, for example).<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">In this blog post, you will learn how to add a calculated field to a form in Five. <\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\">About Five: More Than Just Forms<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Five is a rapid application development environment with advanced form-building features.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">With Five, you can easily launch sophisticated forms to the web in minutes. For an example of a form developed in Five, <a href=\"https:\/\/default-bookingform-tryfive.5au.dev\/url\/booking\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">check out this hypothetical booking form, which combines several of Five&#8217;s features.<\/a><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Unlike traditional form builders, which only store submitted data, Five allows you to <strong>directly connect your form to a database<\/strong>. This connection enables you to <strong>query your database and generate visual representations of your data<\/strong>. Most traditional form builders require exporting data to third-party tools for analysis, adding extra steps and potential for errors.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">While traditional form builders may suffice for very basic data collection tasks, they often struggle with large datasets or high data volumes. <strong>Five\u2019s database-connected solution, on the other hand, is designed to handle substantial amounts of data efficiently<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">One of the standout features of Five is the ability to <strong>create login-protected forms.<\/strong> This ensures that only authorized users can access and process data. Traditional form builders often lack these advanced security features, leaving your data vulnerable to unauthorized access.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">In addition to its advanced data management and security features, <strong>Five allows you to build dashboards and generate detailed reports directly from your data<\/strong>. You can create visual data representations such as charts and graphs.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">To see your form submissions, Five gives you a full-fledged, login-protected submissions admin interface.<\/p>\n\n\n\n<div style=\"background-color: #001524;\"><hr style=\"height: 5px;\">\n<pre style=\"text-align: center; overflow: hidden; white-space: pre-line;\"><span style=\"color: #f1ebda; background-color: #4588d8; font-size: calc(18px + 0.390625vw);\"><strong>Build and Launch Database-Connected Forms<\/strong><br><span style=\"font-size: 14pt;\">Rapidly build and deploy your system today<\/span><\/span><\/pre>\n<p style=\"text-align: center;\"><a href=\"https:\/\/preview-php85.dzine.org\/five\/get-started\" target=\"_blank\" rel=\"noopener\"><button style=\"background-color: #f8b92b; border: none; color: black; padding: 20px; text-align: center; text-decoration: none; display: inline-block; font-size: 18px; cursor: pointer; margin: 4px 2px; border-radius: 5px;\"><strong>Get Instant Access<\/strong><\/button><br><\/a><\/p>\n<hr style=\"height: 5px;\"><\/div>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\">Examples of Calculated Fields<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Calculated fields are very important in form design. They help us process user inputs. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">For example, some forms might ask for first name, middle name, and last name in three separate fields, but once we want to create a PDF report with all our form submissions, we would like these fields to be joined into one. To do so, we can use a calculated field that concatenates the three fields into one.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Another example is a tax rate calculation. Say we have an order form online and want to show our customers the sales tax (or VAT). A calculated field can be used to display taxes.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Another example of a calculated field is a timestamp. For example, we can set a field to &#8220;now&#8221;, meaning its stores the date and time of the form submission. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">There are many examples of calculated fields, and mastering calculations on the form level is an essential skill in form design.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">To see one example in action, visit our <a href=\"https:\/\/default-bookingform-tryfive.5au.dev\/url\/booking\" rel=\"nofollow noopener\" target=\"_blank\">sample form<\/a> and note how the <strong>Price Per ft<sup>2<\/sup><\/strong> is automatically calculated. This calculation happens the moment someone exits the <strong>Size (sq. ft) <\/strong>field. In addition, the <strong>Price Per ft<sup>2<\/sup><\/strong> is a <a href=\"https:\/\/preview-php85.dzine.org\/five\/blog\/conditional-logic-and-branching\/\">read-only field<\/a>, meaning it cannot be overwritten with manual input.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Keep on reading to understand how to create a calculated field in Five.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\">Creating Calculated Fields in Five: Using Formulas and Events<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">To create a calculated field, follow these steps:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Prerequisites:<\/strong><br>Have at least one application with one database table and one form ready in Five.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">1. In Five, go to <strong>Logic &gt; Functions<\/strong>, and click the yellow <strong>Plus <\/strong>button to create a new function. <br>2. Fill in the required <strong>Function ID<\/strong> field. Name your function descriptively. For this tutorial, we are calculating the price per square foot, so our <strong>Function ID <\/strong>is <strong>PricePerSqFt<\/strong>.<br>3. Next, click on <strong>Click to edit <\/strong>in the <strong>Code <\/strong>field.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img width=\"1024\" height=\"388\" src=\"https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-46-1024x388.png\" alt=\"\" class=\"wp-image-3981\" srcset=\"https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-46-1024x388.png 1024w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-46-300x114.png 300w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-46-768x291.png 768w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-46-1536x583.png 1536w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-46-2048x777.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"wp-element-caption\"><em>Add a new function by going to <strong>Logic &gt; Functions &gt; Click to edit<\/strong><\/em><\/figcaption><\/figure>\n<\/div>\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p class=\"wp-block-paragraph\">You should now see a code editor opening up on your screen. <\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img width=\"1024\" height=\"258\" src=\"https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-48-1024x258.png\" alt=\"Use Five's code editor to write custom functions for calculated fields\" class=\"wp-image-3983\" srcset=\"https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-48-1024x258.png 1024w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-48-300x76.png 300w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-48-768x194.png 768w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-48-1536x387.png 1536w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-48-2048x517.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"wp-element-caption\"><em>Five&#8217;s Code Editor lets you write custom functions<\/em><\/figcaption><\/figure>\n<\/div>\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p class=\"wp-block-paragraph\">4. Provide the calculation that you would like your form field to perform. Here is an example of the price per square foot calculations:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#abb2bf;--cbp-line-number-width:calc(1 * 0.6 * .875rem);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#282c34\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewBox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"function PricePerSqFt(five, context, result)  {\n    five.field.PricePerSqft = five.field.Price \/ five.field.Size\t\n    return five.success(result);\n}\" style=\"color:#abb2bf;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki one-dark-pro\" style=\"background-color: #282c34\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C678DD\">function<\/span><span style=\"color: #ABB2BF\"> <\/span><span style=\"color: #61AFEF\">PricePerSqFt<\/span><span style=\"color: #ABB2BF\">(<\/span><span style=\"color: #E06C75; font-style: italic\">five<\/span><span style=\"color: #ABB2BF\">, <\/span><span style=\"color: #E06C75; font-style: italic\">context<\/span><span style=\"color: #ABB2BF\">, <\/span><span style=\"color: #E06C75; font-style: italic\">result<\/span><span style=\"color: #ABB2BF\">)  {<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ABB2BF\">    <\/span><span style=\"color: #E5C07B\">five<\/span><span style=\"color: #ABB2BF\">.<\/span><span style=\"color: #E5C07B\">field<\/span><span style=\"color: #ABB2BF\">.<\/span><span style=\"color: #E06C75\">PricePerSqft<\/span><span style=\"color: #ABB2BF\"> <\/span><span style=\"color: #56B6C2\">=<\/span><span style=\"color: #ABB2BF\"> <\/span><span style=\"color: #E5C07B\">five<\/span><span style=\"color: #ABB2BF\">.<\/span><span style=\"color: #E5C07B\">field<\/span><span style=\"color: #ABB2BF\">.<\/span><span style=\"color: #E06C75\">Price<\/span><span style=\"color: #ABB2BF\"> <\/span><span style=\"color: #56B6C2\">\/<\/span><span style=\"color: #ABB2BF\"> <\/span><span style=\"color: #E5C07B\">five<\/span><span style=\"color: #ABB2BF\">.<\/span><span style=\"color: #E5C07B\">field<\/span><span style=\"color: #ABB2BF\">.<\/span><span style=\"color: #E06C75\">Size<\/span><span style=\"color: #ABB2BF\">\t<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ABB2BF\">    <\/span><span style=\"color: #C678DD\">return<\/span><span style=\"color: #ABB2BF\"> <\/span><span style=\"color: #E5C07B\">five<\/span><span style=\"color: #ABB2BF\">.<\/span><span style=\"color: #61AFEF\">success<\/span><span style=\"color: #ABB2BF\">(<\/span><span style=\"color: #E06C75\">result<\/span><span style=\"color: #ABB2BF\">);<\/span><\/span>\n<span class=\"line\"><span style=\"color: #ABB2BF\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Let&#8217;s only focus on line 2 of this function, as rows 1, 3, and 4 were already provided to us by Five.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Line 2 contains <code>five.field.PricePerSqft = five.field.Price \/ five.field.Size<\/code>, which is an easily readable line of code, even for non-coders. We are simply setting the <strong><code>PricePerSqft<\/code><\/strong> field to be equal to the <code><strong>Price<\/strong> <\/code>field divided by the <code><strong>Size<\/strong> <\/code>field.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">5. When you are done writing your calculation, click the <strong>Save<\/strong> button twice (once to save your code, and once to save the overall function).<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h3 class=\"wp-block-heading\">Explainer: Five\u2019s Syntax For Functions<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Five lets you select between JavaScript and TypeScript for writing functions. Even if you are not familiar with these languages, you would be surprised by how easy it is to write functions in either of these languages using ChatGPT. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">In addition, you can find <a href=\"https:\/\/help.five.org\/2.6\/docs\/api\/five\/functions\/date-time-functions\/now\/\" rel=\"nofollow noopener\" target=\"_blank\">preconfigured functions in our documentation<\/a> here. For example, Five comes with a very handy <code>five.now()<\/code> which returns the current date and time. If you only require a date, use <code>five.date()<\/code>. Five&#8217;s comprehensive library of functions covers many different use cases.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p class=\"wp-block-paragraph\">We have now successfully created a function that interacts with our form field. Now let&#8217;s apply this function to our form. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">6. Go to <strong>Visual &gt; Forms<\/strong> and select the form you would to apply the function to.<br>7. Next, click&nbsp;<strong>Pages<\/strong>&nbsp;and select the page with your form. By default, your form\u2019s first page is always the&nbsp;<strong>General&nbsp;<\/strong>page, as shown here:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img width=\"1024\" height=\"294\" src=\"https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-49-1024x294.png\" alt=\"\" class=\"wp-image-3984\" srcset=\"https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-49-1024x294.png 1024w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-49-300x86.png 300w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-49-768x221.png 768w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-49.png 1536w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p class=\"wp-block-paragraph\">8. Select the <strong>General <\/strong>page (or any other page that is a <strong>Page Type Form)<\/strong>. <br>9. Next, click on <strong>Fields<\/strong> to see an overview of all fields inside your form.<br>10. Select one of your existing fields by clicking on it. You will now see a screen similar to what is shown here:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img width=\"1024\" height=\"461\" src=\"https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-50-1024x461.png\" alt=\"\" class=\"wp-image-3985\" srcset=\"https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-50-1024x461.png 1024w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-50-300x135.png 300w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-50-768x346.png 768w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-50.png 1536w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p class=\"wp-block-paragraph\">11. Click on the <strong>Events<\/strong> tab. Here is what you will see next:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img width=\"1024\" height=\"467\" src=\"https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-51-1024x467.png\" alt=\"\" class=\"wp-image-3986\" srcset=\"https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-51-1024x467.png 1024w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-51-300x137.png 300w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-51-768x350.png 768w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-51-1536x700.png 1536w, https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/image-51-2048x933.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"wp-element-caption\"><em>Functions are attached to events inside Five.<\/em><\/figcaption><\/figure>\n<\/div>\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p class=\"wp-block-paragraph\">12. Attach your function to the relevant event. For our <strong>PricePerSqFt<\/strong> function, we are using the <strong>On Exit <\/strong>event on the <strong>Size<\/strong> field. This means that as soon as a user exits the <strong>Size<\/strong> field (the event), this function will be triggered and the calculations will run.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">13. Click save to associate your function with your event.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h3 class=\"wp-block-heading\">Explainer: Event-Driven Programming in Five<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The thirteen steps described above may look a little overwhelming, however, you have just applied a very powerful programming concept to your application: event-driven programming.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Event-driven programming means that the flow of your application is determined by events that are triggered by your users. Almost everything in Five has events: forms, fields, buttons, etc. You can associate any function with any event. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Event-driven programming also promotes code reuseability. You only have to write a function once to use it in multiple places. This turns Five&#8217;s function menu into a library of functions, which can then be associated with different events.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">If you ever lose track of which function is used with which event, simply go to <strong>Logic &gt; Functions &gt; References. <\/strong>Here you can see exactly when your function is called by which event.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\">Calculated Fields in Forms: Practical Tips<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Once you get your head around calculated fields, functions, and events, you will be able to create almost anything in Five. Five lets you tap into the full power of JavaScript, a language that lets you do almost anything, whether it&#8217;s calculations, text manipulations, or connecting to external systems, for example. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The principle in Five for calculated fields or any other event is always the same: write the function, attach it to an event &#8211; done!<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Note that you can also hide calculated fields so that those submitting a form to you cannot see it. You can switch the show-if for the calculated field to false, hiding the field from your users. This can be helpful if your calculation is an assessment or a score, for example. You can then create different user roles, so that you can see the score, but your users cannot. <\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Do Other Form Builders Support Calculated Fields?<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Other popular form builders, such as Google Forms do not directly support calculated fields or event-driven programming. This makes them more suitable for simple forms, but not forms that need to trigger more complex workflows or processes.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\">Finding Help<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Have more questions? <a href=\"https:\/\/five.org\" rel=\"nofollow noopener\" target=\"_blank\">Join our user community<\/a> to connect with others and get answers.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><br><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Advanced Forms &#8211; Part 7: Automatically Calculate Fields in A Form Hi and welcome to Five&#8217;s Advanced Forms series. In this blog post series, we teach you how to design the perfect form in Five. From changing the layout of your form to adding calculated fields &#8211; we cover everything you need to know to [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":3989,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_eb_attr":"","_uag_custom_page_level_css":"","footnotes":""},"categories":[21,49],"tags":[],"class_list":["post-3978","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","category-how-to"],"acf":[],"uagb_featured_image_src":{"full":["https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/Five.Co-Advanced-Forms-Calculated-Fields.jpg",1280,720,false],"thumbnail":["https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/Five.Co-Advanced-Forms-Calculated-Fields-150x150.jpg",150,150,true],"medium":["https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/Five.Co-Advanced-Forms-Calculated-Fields-300x169.jpg",300,169,true],"medium_large":["https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/Five.Co-Advanced-Forms-Calculated-Fields-768x432.jpg",768,432,true],"large":["https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/Five.Co-Advanced-Forms-Calculated-Fields-1024x576.jpg",1024,576,true],"1536x1536":["https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/Five.Co-Advanced-Forms-Calculated-Fields.jpg",1280,720,false],"2048x2048":["https:\/\/preview-php85.dzine.org\/five\/wp-content\/uploads\/2024\/09\/Five.Co-Advanced-Forms-Calculated-Fields.jpg",1280,720,false]},"uagb_author_info":{"display_name":"Dominik Keller","author_link":"https:\/\/preview-php85.dzine.org\/five\/author\/f1v5_ed3_my\/"},"uagb_comment_info":0,"uagb_excerpt":"Advanced Forms &#8211; Part 7: Automatically Calculate Fields in A Form Hi and welcome to Five&#8217;s Advanced Forms series. In this blog post series, we teach you how to design the perfect form in Five. From changing the layout of your form to adding calculated fields &#8211; we cover everything you need to know to&hellip;","_links":{"self":[{"href":"https:\/\/preview-php85.dzine.org\/five\/wp-json\/wp\/v2\/posts\/3978","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/preview-php85.dzine.org\/five\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/preview-php85.dzine.org\/five\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/preview-php85.dzine.org\/five\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/preview-php85.dzine.org\/five\/wp-json\/wp\/v2\/comments?post=3978"}],"version-history":[{"count":0,"href":"https:\/\/preview-php85.dzine.org\/five\/wp-json\/wp\/v2\/posts\/3978\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/preview-php85.dzine.org\/five\/wp-json\/wp\/v2\/media\/3989"}],"wp:attachment":[{"href":"https:\/\/preview-php85.dzine.org\/five\/wp-json\/wp\/v2\/media?parent=3978"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/preview-php85.dzine.org\/five\/wp-json\/wp\/v2\/categories?post=3978"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/preview-php85.dzine.org\/five\/wp-json\/wp\/v2\/tags?post=3978"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}