Send data & update records
Now that you've loaded your data and displayed it in a table, let's explore how you can modify your data and send it back to the data source.
To do so, follow the next steps:
Drag the Form component from the Components panel on the left and drop it to the right of the Table component. By default, the form is connected to the selected action, and this action is set in the Data property of the form.
Now, change the form's Data value to
ui.tableName.selectedRow.data, wheretableNameis the name of your Table component.
This will allow the form to display the value of the selected row so that you can modify it and send it back.
The form now has the same structure as the table. If you click on a table row, its values will appear in the form.
Next, select the form again and navigate to the Triggers section.
Select On Submit in the first dropdown menu, and next click Create action in the Select action menu.
The new action you create will be bound to the On Submit trigger of the form thus enabling sending data to the data source.
For the new action, select your data source and the appropriate step, for example, Update row.
Choose the table, if needed, and specify the field and values that you want to update.
You can also use the HTTP with POST request step to send data to the API.
If you're not using an HTTP request, you need to configure the following:
In the Filters section, configure the identifier that will be used for record matching. You can refer to it as:
formName is the name of your Form component, fieldName is the name of the field.
In the Configure Row section, add
{{ui.formName.value.fieldName}}to the value of the field you want to update.
To save time configuring each field separately, you can switch to JS mode in the Configure Row section and send the form value object as:
Now, click on the Finish step of the action, and for the On Success trigger select the action that loads your data.
The update action updates data in the data source, so to make sure the table displays actual information you need to add a trigger to reload its values.
Modify any values in the form and click Submit. If everything is configured correctly, it will change the form value, and the table will be updated with new values as well.
Last updated
