Update and Delete Entries6:09 with Guil Hernandez
You've created and read rows of data within your route handlers. In this video, you will continue to update the
routes/articles.js file, this time working on the routes for updating and deleting articles.
We've created and red rows of data within our route handlers. 0:00 And this video will continue to update the articles that JS routes file, 0:05 this time working on the routes for updating and 0:08 deleting articles, updating and deleting entries is a two step process. 0:11 First, you retrieve the entry to update or delete from the database, then once you 0:16 found the entry, performance a sequalize update or destroy operation on it. 0:22 Let's begin by updating an entry. 0:27 We'll work with the get method route that renders the articles edited view. 0:29 Which displays a form to edit the article specified by the ID URL parameter. 0:35 Then we'll work with this http post route, which updates the article in 0:39 the database and redirects to the updated article on form Submit. 0:44 Right now it just redirects to the article's URL path. 0:48 First, I'll use the findByPK 0:52 method in the edit article route to find the article to update. 0:55 I'll initialize an article variable to await article.findByPK. 1:00 And I'll once again pass findByPK ID of the article to edit using 1:07 the id route parameter, with req.params.id. 1:14 Currently, the article or 1:20 locals object passed to the the article's edit view is an empty object. 1:22 Once the article to edit is retrieved we can pass its data 1:26 into the view by setting the article property to the article variable. 1:30 Since they're the same, I can pass it just article. 1:35 Next, the Post method route here will perform a post 1:40 request to the articles ID edit path to update the entry. 1:45 If you have a look at the articles, edit.pug view, you can see the form action 1:51 and method attributes used to send the form data from the client to the server. 1:55 I'll first find the entry to update by its primary key, 2:05 then update the article in the database using sequilizes update method. 2:08 And the handler I'll again initialize an article 2:13 variable to await article.findByPk passing it req.params.id 2:18 The update method is also asynchronous and returns a promise. 2:32 So in the async handler we'll await its fulfilled promise, 2:36 the updated article instance with await article.update 2:41 The update method accepts an object with the key and values to update. 2:48 So I'll pass it the request body or the updated form data with req.body. 2:53 Once the update happens, 3:00 the app will redirect to the individual article page via article.id. 3:02 Back at the app, 3:09 I'll test the latest updates by clicking Edit Article on the first article. 3:10 This brings up the Edit Article form with the content to edit, 3:16 I'll update the title, for example, click Submit and see that it works. 3:21 Next, I'll work on deleting entries. 3:30 There are two routes that deal with deleting an article in articles.JS. 3:33 When you click Delete Article, you're presented with a delete article form 3:37 to confirm that you want to delete the article. 3:42 The route that renders this view is the delete article form get method route. 3:44 Then there is the post method route that actually deals with deleting the article. 3:49 So, first, in the get method route, I'll again use SequlizersfindByPK 3:54 method to find the article to delete by its primary key or ID. 3:59 I'll declare an article variable and 4:04 sign it await Article.findByPk 4:07 (Req.params.id). 4:13 Once the article to delete is retrieved pass its data into 4:18 the articles delete view by passing in the article object. 4:22 Just below in the Post method route, 4:28 I'll find the article to destroy also by its primary key. 4:31 With const, article goes await Article.findByPK. 4:35 Passing it req.params.id. 4:42 Once the article is found I can destroy it. 4:51 The destroy method is also an asynchronous call returning a promise. 4:54 So the handler will await.article.destroy. 4:58 Once the promise is fulfilled or the entry is deleted from the database, 5:06 the router will redirect to the articles path. 5:10 All right, I'll test the latest 5:13 updates by clicking to read an article. 5:17 Then clicking Delete Article, I'm presented with the Delete Article View 5:22 displaying the article title and the actual delete button. 5:27 Click the button and it worked. 5:32 I'm redirected to the main articles page and the deleted article no longer appears. 5:35 All the cred operations are complete, but we haven't handled errors. 5:42 For example, display a validation error 5:46 if a user leaves a field empty when creating or editing an article. 5:49 Also general errors like if a record is missing or 5:53 if any other unforeseen errors occur. 5:56 So in the next step, you'll add validators to the article model to prevent invalid 5:59 data from being entered into the database and display validation errors to the user. 6:04
You need to sign up for Treehouse in order to download course files.Sign up