We have a table that displays task list from Airtable.

We won't get into details of getting this data because it's shown in another tutorial. Let's show few screenshots of its configuration.

Now, let's create our update task form. Create page and add free form component.

So far it is a normal form. It doesn't do anything. Let's connect it to Airtable REST API.

This is an important part. We'll explain one-by-one in more detail. First, in the URL we must send task id. Here's how it's done:

https://api.airtable.com/v0/appHYQdWC40rQAaxR/Tasks/{taskID}

And in parameters, we specify that taskID in URL path gets its value from page variable taskID. Notice the "send in" is path.

Second, Airtable expects fields parameter as object of "Name" and "Status". That's why we use javascript and use Code2's method to get form field values.

return {
"Name": ctx.get("Name"),
"Status": ctx.get("Status")
}

Now that our form is connected to Airtable, let's make a few more configurations. Click on form and add this event.

Click on page and add this event.

This is for getting the data to edit. The data you see when you open the form. Now, let's add the update button to table and send task ID and fields from there.

And for button click we configure it to show our update form in a modal.

And send the task ID with fields from data source.

That's it!

Did this answer your question?