Enhancing AARI Table Fields

Table Operations

Reading All Rows in a Table

1. Add the “Read AARI Table Field” brick

2. Enter a selector for the field name of the table, e.g., #Table0, #Table1, etc. When you type in the selector, PixieBrix will highlight the table:

3. ⚠️ If you are using the brick in a Trigger, set the Root Mode of the brick to Document. If set to Inherit, PixieBrix will not find the table because it will search within the element that triggered the event

   

Setting Cell Values in a Table

1. Add the “Set AARI Table Field Values” brick

2. ⚠️If you are using the brick in a Trigger, set the Root Mode of the brick to Document. If set to Inherit, PixieBrix will not find the table because it will search within the element that triggered the event

Handling Row Clicks

1. Add a Click handler targeting the table field, e.g., #Table1 tbody tr

2. Set the target mode to root. By setting the mode to root the trigger will pass along the row element, even if the use clicks on a cell or input within the row
3. Add the “Read AARI Table Field Row” brick and rename the output key to row
4. Leave the rowSelector blank and set the Root Mode to Inherit for the brick to read from the row that was clicked
5. When you click the row, the output of the brick with be available as an array at @row.values

Reading a Column by Name

1. Add the "Read AARI Table Field Column” brick

2. Provide the table selector based on the field name of the table, e.g., #Table1

3. Provide the column heading to read, e.g., Column 1

4. ⚠️If you are using the brick in a Trigger, set the Root Mode of the brick to Document. If set to Inherit, PixieBrix will not find the table because it will search within the element that triggered the event

Highlighting Cells

1. Add the “Highlight AARI Table Cells” brick

2. ⚠️If you are using the brick in a Trigger, set the Root Mode of the brick to Document. If set to Inherit, PixieBrix will not find the table because it will search within the element that triggered the event

Appending a Row to a Table

1. Add the “Append AARI table row” brick

2. Provide the table selector based on the field name of the table, e.g., #Table1

3. Provide an array of values to write in the new row. You can also pass an array of values

   
4. ⚠️ If you are using the brick in a Trigger, set the Root Mode of the brick to Document. If set to Inherit, PixieBrix will not find the table because it will search within the element that triggered the event

Table Validation and Calculations

Example: Checking Aggregate Values

• Add the @pixiebrix/jq brick

• Pass the output key of the “Read AARI Table Field” brick for the data property

• The check if the value in the last row is equal to the sum of the proceeding columns, use the following jq filter:

  Property	Value
  filter	(.rows[-1]["Column 1"] | tonumber) == (.rows[0:-1] | map(.["Column 1"] | tonumber) | add)
  data	@table

The (.rows[-1]["Column 1"] | tonumber) expression gets the value in the last row and converts it to a number

The (.rows[0:-1] | map(.["Column 1"] | tonumber) | add) expression gets the proceeding rows, converts the value in Column 1 to a number, and sums the values

Example: Multi-Column Validation

• Add the @pixiebrix/jq brick

• Pass the output key of the “Read AARI Table Field” brick for the data property

• To report rows where the value in “Column 1” is greater than the value in “Column 2”, use the following jq filter:

  Property	Value
  filter	.rows | map((.["Column 1"] | tonumber) > (.["Column 2"] | tonumber)) | to_entries | map(select(.value)) | map({row: .key, column: 1})
  data	@table

.row |

# Map to an array of true/false with the condition
map((.["Column 1"] | tonumber) > (.["Column 2"] | tonumber)) |

# Map to an array of records with {key: <row index>, value: <condition>}
to_entries |

# Exclude entries where the condition is false
map(select(.value)) | 

# Map to an array of rows/columns indexes (e.g., to pass to the Highlight AARI Table Cells brick)
map({row: .key, column: 1})

• Pass the output of the jq brick to the Highlight AARI Table Cells brick

Writing Table Selectors

Table Selectors

The AARI Table Fields can each be targeted with a selector corresponding to the field in the form #Table0, #Table1

Column Selectors

To target a particular column in the table, you can:

• Target the column id: #Table1 td:has(#Table1_col0-defaultValue). NOTE: the column id is not necessarily the column index. The column id is dependent on which order the the columns were added during AARI form creation

• Target the column by index (1-indexed): #Table1 td.preview-table__body-column:nth-child(1)

Known Limitations

“Attach Autocomplete” brick fills multiple cells when a value is selected

There is a known issue when selecting a value from Attach Autocomplete brick that it fills all the inputs matching the selector. (I.e., as opposed to only filling the input for which the autocomplete was shown)