User Input - Dynamic Calculated Column

Goal:
I have a table component with editable columns. I would like the user to be able to input values into a cell in the table component, and the custom column dynamically shows the new calculated value.

In the custom column, I put this as the datasource, the idea is that column A * (columnB/ColumnC):

{{ **
** (table34.changesetObject?.[currentSourceRow.fee_id]?.fee_initial_value ?? currentSourceRow.fee_initial_value) * **
(
** (table34.changesetObject?.[currentSourceRow.fee_id]?.sale_index_current_value ?? currentSourceRow.sale_index_current_value) **
** / (table34.changesetObject?.[currentSourceRow.fee_id]?.sale_index_initial_value ?? currentSourceRow.sale_index_initial_value)

**) **
}}

This used to work but for some reason, not anymore. Since I'm not too well vested with JS, I'm struggling to fix it.

This is the idea more or less of the outcome I am looking for.

image

Hello there!
It's not recommended to use inline JS if you want to perform calculations. It would be better to use a JS Transformer (documentation here), and to set the data source of the custom field to that JS Transformer that you create. That should do the trick!

1 Like

I'll echo the above recommendation! It's generally easier to maintain JS code in a transformer, too. That said, there's no reason that doing it this way won't work.

Is the cell just not updating when you make changes to the table? Or is it throwing an error?

hey Darren!
Initially it was showing the dynamic values (so if i would change any of the values in the relevant columns), it would change the custom column.
Now its not showing anything in the column.

I'm at a very basic level of writing JS or transformers, I did try my hand at it but with little success :exploding_head:

This is what i have:

const row = {{ table34.selectedRow }};
const changes = {{ table34.changesetObject }};
const id = row.fee_id;
const edited = changes[id] || {};

const fee = edited.fee_initial_value ?? row.fee_initial_value;
const current = edited.sale_index_current_value ?? row.sale_index_current_value;
const initial = edited.sale_index_initial_value ?? row.sale_index_initial_value;

return initial ? fee * (current / initial) : null;

hello there!
Noted! I am struggling a bit with the transformers route, I think that there is something wrong with mscript logic :confused:

Can you show me how you've configured the data source for the custom column?

Let us know if you still have questions about this, @gia!

hey @Darren its sorted, thank you!