Hello PerfectApps Community,
Now that we have discussed when it is appropriate to use a table, I would like to provide you with some additional tips when using our form creation software to help in your build. As mentioned in our last article, tables are a great tool for forms that require calculations, such as order forms. Tables work well as they have the ability to add and remove lines as needed by the user. Over this article, I will discuss how to properly include behaviors to calculate a line total and a sum of your line items.
Let’s begin by adding a table to your canvas, this table will consist of 4 columns:
• Quantity (Formatted as numeric)
• Item (Formatted as text)
• Cost (Formatted as numeric)
• Total (Formatted as numeric)
Now that our table has been configured we can begin building the behaviors. The goal of our first behavior will be to calculate a total based upon the quantity and price of an item. Please follow the steps below:
1. Click on the ‘Quantity’ column of the table.
2. Click on ‘Numeric Input changes field data’ at the bottom right of the properties panel under the behaviors section.
3. Drag a ‘Set field’ behavior onto the canvas
4. Click the ‘Set field’ behavior and Select ‘Total – Current Row’ on your table as the target of your behavior.
5. Click on ‘Formula’ in the ‘Set field’ behavior properties.
6. Click on the ‘Compose’ button just below ‘Formula’
7. Add the formula (Quantity – Current row * Cost – Current row) as depicted below:
Once you have completed the steps above please repeat the exact same steps for the ‘Cost’ column in the table. By adding the behavior to both columns you can ensure that the total will be recalculated if the price or the quantity changes. With the behaviors applied to both columns, you may now proceed to test by clicking preview.
Once you are satisfied with testing you can move forward to the next step, calculating the sum of the total column in your table. To add this functionality, we will need to add an additional numeric input field to the canvas. I like to place this field directly under the total column of the table. This field should be named ‘Sum.’ Next, click on the ‘Total’ column of the table followed by ‘Numeric Input changes field data’ in the bottom right of the properties panel. Drag a ‘Set Field’ behavior on the canvas then select the ‘Sum’ field as the target of the behavior. Once complete, click ‘Formula’ then the ‘Compose’ button right under the ‘Formula.’ For this behavior, clear the ” from the formula by click on the entry and clicking the trash can, then click the ‘Add Function’ button. Scroll down the function list and click the ‘Sum’ function from the list. In the function click the ” then select the field ‘Total – All rows’ in your table. Your behavior is now complete and ready to test to ensure the proper result is achieved.