Ask AI

Edit Record

Letting users update records in your data.

This Action Button lets you update records in your data source.

๐Ÿ’ก
By default, youโ€™ll have one Edit button added to your items, which you can remove if needed.

To demonstrate how the Edit Record button works, weโ€™re going to use a List block connected to an Airtable data source, which shows a list of tasks for a hypothetical product development team and has three fields: Name (the name of the task), Assignee (who it is assigned to), and Status (the current progress status of the task). We want to enable an โ€œUpdate task statusโ€ button to allow each development team member to update the status of his/her own task.

List of tasks
List of tasks

First, we are going to configure the button label.

Button label
Button label
ย 

Then, we are going to customize the labels and messages that are going to be displayed on the pop-up that the users are going to use to perform the update.

Customizing pop-up labels
Customizing pop-up labels

Next, we need to specify which fields from our data are going to be available for update. By default, all the fields present in the connected data source are going to be added automatically. So, letโ€™s remove the ones that we donโ€™t need and leave Status only. As you can see in the following gif, the field is already mapped to its corresponding field on Airtable, so we donโ€™t need to do anything else there. Weโ€™ll just add a label.

Configuring connected fields
Configuring connected fields
โ—
Note that computed fields will not appear in the list of mappable fields for the form.

Button Visibility

Now, letโ€™s configure the button visibility to specify who exactly can see and thus use the button. The users of our task list are the same people who are working on those tasks, so we are going to connect the same Airtable base with tasks and assignees to Softr as a user database.

Airtable table with the list of tasks and assignees.
Airtable table with the list of tasks and assignees.
๐Ÿ’ก
The users sync between Softr and data source is one-way (from Softr to data source), so, if you connect a data source with users without having them in Softr first, youโ€™ll need to create the same users in Softr as well to establish the connection.

Now, letโ€™s configure the actual button visibility settings. The users need to be able to update their own tasks only, so weโ€™re going to set a conditional visibility rule according to which the user sees the update button only on the tasks that have his/her email in the Assignee Email field.

Configuring visibility rules
Configuring visibility rules
ย 

Thatโ€™s it. The last step is to make sure everythingโ€™s working as expected.

Testing task status update

To test our setup, we are going to log into our application with one of the application users and update her task status. The following gif illustrates that.

User updating her task status
User updating her task status
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
Did this answer your question?
๐Ÿ˜ž
๐Ÿ˜
๐Ÿคฉ

Last updated on September 1, 2023