From the course: Next.js 14 from Scratch: Build a Real-World Project Using Next.js 14 and MongoDB

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

Edit property form

Edit property form - Next.js Tutorial

From the course: Next.js 14 from Scratch: Build a Real-World Project Using Next.js 14 and MongoDB

Start my 1-month free trial Buy for my team

Edit property form

“

All right, guys, so now we want to be able to edit our listing. So there's really two steps to this, and we're going to do it in two videos. First is going to be to create the Edit page. You can see it goes to Properties, and then the ID, and then slash Edit. So we want the form. We also want to fetch the properties and fetch the property and put it into the form, all the details. And then the second part will be to actually create the API route to update the data in the database and handle that. All right, so let's create the page. So it's going to be under app slash property slash brackets ID slash edit. So app, properties, brackets ID, and then a folder called edit, and then a file called page.jsx. And we'll do rafce. Let's call this property edit page. So now we should see that here. And then we'll have a form. So let's go to components, create a new file called property edit form. And for now, we'll just do that. And then we'll bring it into the page. So import, property, edit…

Contents