Table Save Action - Set Table Value In A Variable

App Building
1

  • Goal: Update table row values, then save them to a variable. Instead of saving the changes made, I want to save the entire table value (not just the updated rows) to the variable. The table value is pulled from a third-party form which is immutable. We double-check the table data with the user, and adjust the data as needed. Once changes are confirmed / can be saved, we want to click the Save action to save the value to a variable. From there, we will pull this data into a database so we can reference that data later.

  • Problem: When using the save action, the data does not get saved to the variable. I've tried setting the value to the tablename.data or Object.values(companyAddressTable.data) and the same thing happens. I'm sure this is something small I am missing. I do have a primary key set if that matters. Below is the save action event handler:

image

2

Hi @snapcom

I think what you're looking for is companyAddressTable.changesetArray

The table stores pending edits in both the changesetArray and changesetObject properties, rather than the data property

You'll need to code your own implementation to "merge" the changes with the table's data, then set your variable to this new value

Example save handler script, assuming primary key is "id":

const data = [...companyAddressTable.data];

const new_data = companyAddressTable.changesetArray.reduce((previous, changeset_item) => {

  const item_index = previous.findIndex(item => item.id === changeset_item.id);

  const new_item = ({
    ...previous[item_index],
    ...changeset_item
  });

  return [
    ...previous.slice(0, item_index),
    new_item,
    ...previous.slice(item_index +1, previous.length)
  ]

}, data);

await setAddresses.setValue(new_data);

The only thing missing is that you'll also need to find a way to save these changes back to the query feeding data to the table, otherwise it will look like your changes are "undone" when the changeset is cleared after the save handler runs.

Hope this helps!

2 Likes
3

First, appreciate the reply! From what you've said about the data property not storing pending edits, I'm starting to wonder if it makes sense to change how I approach this. It may make more sense to fetch the form data and add it to postgres, and from there update the postgres row(s) as needed. Does that seem like a better way to handle this to you?

1 Like
4

Hey @snapcom - welcome back to the forum! :wave: It's been a while.

If I understand your objective correctly, the workaround that I typically see implemented is something like the following:

  1. Fire off query to immutable data source and save result in a variable.
  2. Populate the table with data from the variable.
  3. Save table edits to the variable.
  4. Write variable data to external database.

Depending on how long it takes a user to modify the table content, this approach is perfectly fine. If it's a longer process and you want to be able to save your progress while editing, it probably makes sense to first save the table contents to your external database and then use it as your source of truth while editing.

I hope that helps!