1 00:00:00,750 --> 00:00:05,660 In this video we are going to implement deleting of a comment. 2 00:00:05,670 --> 00:00:10,710 The logic is going to be the same as deleting of a post. 3 00:00:10,890 --> 00:00:18,510 So first step is that we are going to target the link of the icon to click to delete. 4 00:00:18,540 --> 00:00:27,120 So let's go to this page and when I click on this icon, I want to directly remove that. 5 00:00:27,120 --> 00:00:33,120 And the first step is let's look at the control logic for deleting of the comment. 6 00:00:33,450 --> 00:00:38,750 We are done with the creation and the details will come back to it. 7 00:00:38,760 --> 00:00:41,940 So let's focus on the delete and for delete. 8 00:00:41,940 --> 00:00:46,320 We only need the ID of the comment that we want to delete. 9 00:00:46,530 --> 00:00:56,070 So let's get back to the post details inside views and post details dot edges and let's locate the icon 10 00:00:56,070 --> 00:01:03,090 for delete, which is this Because we are going to make this or delete method, we need to use a form 11 00:01:03,090 --> 00:01:05,580 as we did for deleting a post. 12 00:01:05,580 --> 00:01:10,650 So even up here we can copy what we did, which is this one. 13 00:01:10,650 --> 00:01:12,780 So I'm going to copy this one. 14 00:01:13,600 --> 00:01:16,990 And down here I'm going to replace. 15 00:01:18,110 --> 00:01:19,220 This one. 16 00:01:19,220 --> 00:01:19,860 Wait. 17 00:01:19,880 --> 00:01:21,350 The one I copied. 18 00:01:21,740 --> 00:01:22,430 Perfect. 19 00:01:22,550 --> 00:01:23,960 This is a form. 20 00:01:24,590 --> 00:01:27,740 And inside I have the trust icon. 21 00:01:27,980 --> 00:01:30,920 Their path is going to be comment. 22 00:01:31,910 --> 00:01:37,730 And then the ID of the comment is inside here as comment underscore ID. 23 00:01:37,760 --> 00:01:42,500 The method is called delete and I pass in method go post. 24 00:01:42,510 --> 00:01:45,200 We are going to overwrite this one to use this. 25 00:01:45,470 --> 00:01:48,230 So now let's have a look. 26 00:01:49,620 --> 00:01:50,850 Refresh it. 27 00:01:51,360 --> 00:01:55,140 And down here, you can see that the CSS has messed up. 28 00:01:55,260 --> 00:02:00,960 So what we can do is that we can add the class name as well. 29 00:02:01,200 --> 00:02:04,020 Let's see what we have for this. 30 00:02:04,770 --> 00:02:08,419 Yeah, because I use what is called Post editors action. 31 00:02:08,430 --> 00:02:13,980 I can use this one also as a wrapper for that. 32 00:02:13,980 --> 00:02:17,730 So let's see, which is this? 33 00:02:17,730 --> 00:02:21,240 So I'm going to change this one to use this class name. 34 00:02:22,920 --> 00:02:24,450 Remove this one. 35 00:02:25,300 --> 00:02:28,120 All right, So let's save it and let's see. 36 00:02:28,890 --> 00:02:32,470 Okay, Now I have it when I click on this one. 37 00:02:32,470 --> 00:02:36,520 Success comment has been deleted successfully. 38 00:02:36,670 --> 00:02:41,560 If I go to homepage and refresh, I can see that the DX is no more. 39 00:02:41,590 --> 00:02:42,880 Likewise this. 40 00:02:43,000 --> 00:02:45,960 And what about Imus comments? 41 00:02:45,970 --> 00:02:46,660 Let's see. 42 00:02:47,080 --> 00:02:51,040 And you can see that you are not allowed to delete this comment. 43 00:02:51,040 --> 00:02:56,320 And I got this one from the controller and which is this one? 44 00:02:56,650 --> 00:03:03,910 And again, I don't want to display that message because we are going to hide the icon from not authorized 45 00:03:03,910 --> 00:03:04,630 user. 46 00:03:04,990 --> 00:03:06,490 What about redirecting? 47 00:03:06,550 --> 00:03:09,880 Is going to be the same as creating a comment. 48 00:03:09,880 --> 00:03:13,420 So here I'm going to use the same redirect. 49 00:03:14,730 --> 00:03:15,870 And. 50 00:03:17,370 --> 00:03:25,410 Inside the delete after success Here I'm going to redirect and change this one to comment. 51 00:03:25,740 --> 00:03:27,270 And that is it. 52 00:03:27,270 --> 00:03:29,490 So let's refresh it. 53 00:03:31,600 --> 00:03:33,160 And delete. 54 00:03:36,340 --> 00:03:45,640 Well, we have this empty data simply because we are finding a post using the comment ID. 55 00:03:45,730 --> 00:03:54,760 That is what we have implemented inside the delete controller, which is the ID of the comment here. 56 00:03:55,150 --> 00:04:01,750 So what we want to do is to pass in the post ID, but unlucky for us. 57 00:04:01,750 --> 00:04:06,280 We don't have the post ID inside this controller. 58 00:04:06,670 --> 00:04:13,410 But the problem is that we don't have the post ID inside this controller. 59 00:04:13,420 --> 00:04:15,730 So how are we going to get it done? 60 00:04:15,760 --> 00:04:20,930 Well, we are going to pass it as a query string. 61 00:04:20,950 --> 00:04:28,840 So let's go to the post details and when you say query string, they are additional attributes or parameters 62 00:04:28,840 --> 00:04:32,980 being parsed when making the request in the you are error. 63 00:04:33,100 --> 00:04:40,320 So for example, having looked at this one, we have question mark and then follow the method. 64 00:04:40,330 --> 00:04:48,010 So anything that follows after question mark is query string meaning going to be additional payload. 65 00:04:48,070 --> 00:04:56,560 So for this we are going to pass in additional query string to this in addition with the method called 66 00:04:56,560 --> 00:04:57,310 delete. 67 00:04:57,310 --> 00:04:59,900 So how are we going to get it done? 68 00:04:59,920 --> 00:05:10,450 Well, we are going to use an operator because we are chaining additional query and I'll call this one 69 00:05:10,450 --> 00:05:11,980 as post. 70 00:05:12,750 --> 00:05:23,250 I did and is equal to the post inside this template and I have it as that so I can copy this one and 71 00:05:23,250 --> 00:05:24,450 scroll down. 72 00:05:25,360 --> 00:05:27,040 And pace it here. 73 00:05:27,160 --> 00:05:32,320 So how can we have access to this query inside our controller? 74 00:05:32,590 --> 00:05:38,350 If we go to the controller, that is the command, which is the delete. 75 00:05:38,350 --> 00:05:44,110 If you console log req, dot query, you're going to see the one that we passed. 76 00:05:44,110 --> 00:05:47,050 So I'm going to be asked rec dot query. 77 00:05:48,160 --> 00:05:51,270 Let's make a request to delete a comment. 78 00:05:51,280 --> 00:05:55,870 So let me refresh this one and let me click on this. 79 00:05:56,590 --> 00:05:59,410 And let's check the terminal. 80 00:06:02,070 --> 00:06:07,370 And here you can see we have the query string being passed in. 81 00:06:07,380 --> 00:06:13,320 So what we want is the post ID when we go to home page. 82 00:06:13,320 --> 00:06:22,560 Let's go to home and let's click on Continue and you can see that this is the post ID that we are referring 83 00:06:22,560 --> 00:06:25,080 to which is inside the query. 84 00:06:25,620 --> 00:06:30,810 So here we are going to make use of dot post ID. 85 00:06:32,010 --> 00:06:32,750 Ice dance. 86 00:06:32,760 --> 00:06:37,350 Let me cross-check again is post ID. 87 00:06:37,440 --> 00:06:43,560 So here, instead of the comments we are going to use the post ID. 88 00:06:44,610 --> 00:06:46,030 Going to be rec. 89 00:06:46,050 --> 00:06:47,460 Dot query. 90 00:06:48,060 --> 00:06:50,160 Dot post ID. 91 00:06:50,190 --> 00:06:53,430 Now with this one we be able to redirect. 92 00:06:53,460 --> 00:06:54,840 So let's see. 93 00:06:54,840 --> 00:06:57,960 Refresh it and continue. 94 00:07:00,430 --> 00:07:03,170 There is no comment created by NDI. 95 00:07:03,190 --> 00:07:05,910 So let me add some comments here. 96 00:07:07,640 --> 00:07:08,690 And I have it. 97 00:07:08,690 --> 00:07:10,580 So let me go ahead and trash. 98 00:07:11,760 --> 00:07:18,150 And you can see that on the Post details page how awesome it is. 99 00:07:18,330 --> 00:07:18,930 All right. 100 00:07:18,930 --> 00:07:24,270 The next video, let's go ahead and then implement the updating of a comment.