Summing Array
-
Add a new Array widget
- Drag an Array widget onto your Web Interface.
- Assign a Widget ID (e.g.,
id_array_po) and a Variable Name (e.g.,array_po).
-
Define the input columns
- Add at least two numeric columns for user input, for example:
Quantity→ Type: Number → variable:quantityUnit Price→ Type: Number → variable:unit_price
-
Add the calculated column (Subtotal)
- Add a new numeric column.
- Set its ID (e.g.,
id_subtotal) and variable name (e.g.,subtotal). - Enable Footer and select a Predefined Function (e.g.,
Sum) so the total is displayed at the bottom of the column.
-
Add the calculation column
- Add a new column of type JS.
- Add the variables to listen to (e.g.,
array_po.quantity[P_index]) - In the JS column’s script editor, paste the following code:
var my_subtotal = parseFloat([[array_po.quantity]][P_index]) * parseFloat([[array_po.unit_price]][P_index]); id_array_po.id_subtotal[P_index].setText("" + my_subtotal); id_array_po.id_subtotal[P_index].setActive(false); -
Dependencies explained
array_po→ the variable name of the Array widget.quantity / unit_price→ the variable names of the input columns.P_index→ the current row index provided automatically.id_array_po→ the widget ID of the array.id_subtotal→ the column ID for the Subtotal.
-
Test the Web Interface
- Save and run the interface.
- Add a row, type a Quantity and Unit Price.
- The Subtotal auto-calculates, and the Footer shows the total of all subtotals.
Note: This example is only valid for the Application Runner engine.