Skip to content

Summing Array

  1. 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).
  2. Define the input columns

    • Add at least two numeric columns for user input, for example:
    • Quantity → Type: Number → variable: quantity
    • Unit Price → Type: Number → variable: unit_price
  3. 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.
  4. 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);
    
    

  5. 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.
  6. 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.