1
00:00:00,480 --> 00:00:05,230
We've created and red rows of
data within our route handlers.

2
00:00:05,230 --> 00:00:08,980
And this video will continue to update
the articles that JS routes file,

3
00:00:08,980 --> 00:00:11,250
this time working on the routes for
updating and

4
00:00:11,250 --> 00:00:16,100
deleting articles, updating and
deleting entries is a two step process.

5
00:00:16,100 --> 00:00:22,220
First, you retrieve the entry to update or
delete from the database, then once you

6
00:00:22,220 --> 00:00:27,960
found the entry, performance a sequalize
update or destroy operation on it.

7
00:00:27,960 --> 00:00:29,615
Let's begin by updating an entry.

8
00:00:29,615 --> 00:00:35,240
We'll work with the get method route
that renders the articles edited view.

9
00:00:35,240 --> 00:00:39,970
Which displays a form to edit the article
specified by the ID URL parameter.

10
00:00:39,970 --> 00:00:44,360
Then we'll work with this http post route,
which updates the article in

11
00:00:44,360 --> 00:00:48,260
the database and redirects to
the updated article on form Submit.

12
00:00:48,260 --> 00:00:51,450
Right now it just redirects
to the article's URL path.

13
00:00:52,860 --> 00:00:55,610
First, I'll use the findByPK

14
00:00:55,610 --> 00:01:00,120
method in the edit article route
to find the article to update.

15
00:01:00,120 --> 00:01:07,880
I'll initialize an article variable
to await article.findByPK.

16
00:01:07,880 --> 00:01:14,809
And I'll once again pass findByPK
ID of the article to edit using

17
00:01:14,809 --> 00:01:20,240
the id route parameter,
with req.params.id.

18
00:01:20,240 --> 00:01:22,210
Currently, the article or

19
00:01:22,210 --> 00:01:26,810
locals object passed to the the article's
edit view is an empty object.

20
00:01:26,810 --> 00:01:30,300
Once the article to edit is
retrieved we can pass its data

21
00:01:30,300 --> 00:01:35,360
into the view by setting the article
property to the article variable.

22
00:01:35,360 --> 00:01:37,760
Since they're the same,
I can pass it just article.

23
00:01:40,881 --> 00:01:45,861
Next, the Post method route
here will perform a post

24
00:01:45,861 --> 00:01:51,303
request to the articles ID
edit path to update the entry.

25
00:01:51,303 --> 00:01:55,989
If you have a look at the articles,
edit.pug view, you can see the form action

26
00:01:55,989 --> 00:02:00,677
and method attributes used to send the
form data from the client to the server.

27
00:02:05,072 --> 00:02:08,442
I'll first find the entry to
update by its primary key,

28
00:02:08,442 --> 00:02:13,520
then update the article in the database
using sequilizes update method.

29
00:02:13,520 --> 00:02:18,734
And the handler I'll again
initialize an article

30
00:02:18,734 --> 00:02:25,697
variable to await article.findByPk
passing it req.params.id

31
00:02:32,145 --> 00:02:36,800
The update method is also asynchronous and
returns a promise.

32
00:02:36,800 --> 00:02:41,447
So in the async handler we'll
await its fulfilled promise,

33
00:02:41,447 --> 00:02:45,920
the updated article instance
with await article.update

34
00:02:48,790 --> 00:02:53,990
The update method accepts an object
with the key and values to update.

35
00:02:53,990 --> 00:03:00,700
So I'll pass it the request body or
the updated form data with req.body.

36
00:03:00,700 --> 00:03:02,515
Once the update happens,

37
00:03:02,515 --> 00:03:07,471
the app will redirect to the individual
article page via article.id.

38
00:03:09,706 --> 00:03:10,762
Back at the app,

39
00:03:10,762 --> 00:03:16,130
I'll test the latest updates by clicking
Edit Article on the first article.

40
00:03:16,130 --> 00:03:21,652
This brings up the Edit Article
form with the content to edit,

41
00:03:21,652 --> 00:03:28,358
I'll update the title, for example,
click Submit and see that it works.

42
00:03:30,527 --> 00:03:33,040
Next, I'll work on deleting entries.

43
00:03:33,040 --> 00:03:37,640
There are two routes that deal with
deleting an article in articles.JS.

44
00:03:37,640 --> 00:03:42,390
When you click Delete Article, you're
presented with a delete article form

45
00:03:42,390 --> 00:03:44,770
to confirm that you want
to delete the article.

46
00:03:44,770 --> 00:03:49,756
The route that renders this view is
the delete article form get method route.

47
00:03:49,756 --> 00:03:54,720
Then there is the post method route that
actually deals with deleting the article.

48
00:03:54,720 --> 00:03:59,310
So, first, in the get method route,
I'll again use SequlizersfindByPK

49
00:03:59,310 --> 00:04:04,030
method to find the article to
delete by its primary key or ID.

50
00:04:04,030 --> 00:04:07,460
I'll declare an article variable and

51
00:04:07,460 --> 00:04:13,099
sign it await Article.findByPk

52
00:04:13,099 --> 00:04:18,370
(Req.params.id).

53
00:04:18,370 --> 00:04:22,300
Once the article to delete is
retrieved pass its data into

54
00:04:22,300 --> 00:04:26,750
the articles delete view by
passing in the article object.

55
00:04:28,530 --> 00:04:31,050
Just below in the Post method route,

56
00:04:31,050 --> 00:04:35,275
I'll find the article to destroy
also by its primary key.

57
00:04:35,275 --> 00:04:42,965
With const,
article goes await Article.findByPK.

58
00:04:42,965 --> 00:04:47,300
Passing it req.params.id.

59
00:04:51,310 --> 00:04:54,450
Once the article is
found I can destroy it.

60
00:04:54,450 --> 00:04:58,310
The destroy method is also
an asynchronous call returning a promise.

61
00:04:58,310 --> 00:05:06,100
So the handler will await.article.destroy.

62
00:05:06,100 --> 00:05:10,410
Once the promise is fulfilled or
the entry is deleted from the database,

63
00:05:10,410 --> 00:05:13,242
the router will redirect
to the articles path.

64
00:05:13,242 --> 00:05:17,554
All right, I'll test the latest

65
00:05:17,554 --> 00:05:22,794
updates by clicking to read an article.

66
00:05:22,794 --> 00:05:27,996
Then clicking Delete Article,
I'm presented with the Delete Article View

67
00:05:27,996 --> 00:05:32,850
displaying the article title and
the actual delete button.

68
00:05:32,850 --> 00:05:35,500
Click the button and it worked.

69
00:05:35,500 --> 00:05:41,160
I'm redirected to the main articles page
and the deleted article no longer appears.

70
00:05:42,270 --> 00:05:46,280
All the cred operations are complete,
but we haven't handled errors.

71
00:05:46,280 --> 00:05:49,280
For example, display a validation error

72
00:05:49,280 --> 00:05:53,750
if a user leaves a field empty when
creating or editing an article.

73
00:05:53,750 --> 00:05:56,910
Also general errors like
if a record is missing or

74
00:05:56,910 --> 00:05:59,920
if any other unforeseen errors occur.

75
00:05:59,920 --> 00:06:04,073
So in the next step, you'll add validators
to the article model to prevent invalid

76
00:06:04,073 --> 00:06:08,367
data from being entered into the database
and display validation errors to the user.