Now that I've got entries in my Bubble database, how do I edit them? In this Bubble tutorial, I'm going to demonstrate to you how we can use the make changes to thing workflow action to edit the contacts in our database.
Make changes to a thing...
So I'm going to go back into the editor and I've got my table set up here and I'm going to edit by using a pop-up. And this is just one way that you can edit, you basically get to a point where you're displaying a form in order to edit data in your Bubble app.
Using a pop-up to edit a database entry
So that's added a pop-up and I'm going to make this a column, add in a little bit of padding. I'm going to make the design quite rough because it's not what I'm wanting to focus on in this video. So I'm going to add in a field and we'll call this first name and copy and paste it, last name and then I actually think that country is an option set. Let me check on my contacts. No, country is just a regular text field. Fine, let's just copy and paste this one there and and say 'country'. I'm going to add a little bit of a gap to make it all neat. And last thing we need is the button. I'll just say 'save changes'. So there are a few extra things we need to set up. One is when a user clicks on the contact they want to edit, we need to bring up this form and it makes sense that this form is then populated with previous data and then that data can be changed and those changes saved. So to do that I'm going to set the type of content here to contact but leave the data source blank. That's because I'm going to set it up so that when the first name label is clicked, instead of go to page, that's from a different tutorial, I am going to show the pop-up and I'm going to display data in that pop-up of current rows contact.
Pre-fill fields with initial content
So that then means that the pop-up has available to itself the contact that's been passed into it through clicking on the contact in the table element. So now on my fields I can set initial contact, initial content. And so I could say parent groups because that's the pop-up contacts first name initial content parent groups last name and initial content country. Let's test that. So if I click on Bruce, I then get Bruce's details ready for me to save changes. Let's set up the save changes button now.
Save changes button
So I'm going to add a workflow and that takes us into the workflow tab and it sets up a workflow ready for the action of "Save Changes" button is clicked. So then I make changes to a thing and that's going to be parent groups contacts. Again, the contact that we've passed in to the pop-up and then I select all the fields that I want to make changes to and I match up those fields. A temptation here is to think "Oh, I should be using this contact." Note, this contact refers to the contact that's been passed into it. So, if you were to use this contact, you wouldn't be looking to the new data in the input fields, you're in fact just overwriting previous data with identical previous data. So we want to make sure that we're linked in with our inputs. And then this is an input last name and input country. Okay, now this is the part where I often forget what is logically the next step. You've got to show... no, you've got to hide the pop-up. Otherwise, you're stuck on the form and you don't know whether it's been completed or not. So, let's go for Pepper, and let's say we change this to Pots, and we save changes, and you can see Pots is updated. We're clicking it again, change it back to Stark, and it's been updated.
If you're learning Bubble, we've got hundreds of Bubble tutorial videos available. Some of them are on YouTube, but you'll find many more on our website, planetnocoode.com, where we've got videos exclusive to our members. And if you're serious about learning Bubble and you're enjoying this video format, check out our other Bubble tutorial videos.