Crash Course 101
10 modules
5 weeks

Editing records

Click to copy

How to edit records in web applications

Now we are ready to start editing. Let's do this using the example of a table with cities. Perhaps a city has received updated information about the population, the informational description has changed, or even the name. To do this, we need to create a button in the table that will open the modal window and also create the modal window itself, in which editing will be carried out.

In general, this process is very similar to how the original creation of new records was carried out. We also pressed a button there, and a modal window appeared, filling in the necessary data. But when creating all the input fields in the modal was empty; we didn't need to know the ID of the post we were creating. All data was either filled in manually or assigned automatically. Now, for editing, you need to open a strictly defined record and get exactly its data.

Let's start by setting up the edit button. Its task will be to write the post ID to the global variable and open a modal editing window. Let's create the corresponding business process. You can see that the created global variable is in the general list of blocks under its unique name.

After that, you need to configure the modal editing window itself. Visually, it does not differ in anything (except for the name) from the modal window that was created earlier to add new records to the database. The key difference lies in the business process that must be started when the window is opened.

Its task is almost a mirror image of what was done earlier when creating a record of a new city. It is necessary to take the city ID from a global variable, get information from the database and distribute it to the appropriate input fields.

Patching record

After that, it remains only to configure the Save button by creating a business process for it similar to the one used to create a new city. The only differences are the use of an ID from a global variable and the request type PATCH instead of POST.

Now, when you click on the edit button, you can open detailed information about the desired record from the database, change any field and save the changes.

The use of global variables allowed us to save information about which record should be edited at the moment, record its ID and refer to it if necessary. At the same time, thanks to global variables, the speed of the application increases because otherwise, it would be necessary to save this data in the database and make additional requests to it.

Was this article helpful?
Still looking for an answer?
Join the Community