Welcome back.
So next up we're focusing on two leading campgrounds which is nice and short.
Actually it's a single route remembered our destroy route is slash campgrounds slash ID as a delete
request and all we need to do is write a form that sends a tweet request to that you url.
We click on it it removes it using find by id and remove and then redirects us back somewhere.
So let's get started.
Instead of my campground Yes I'm going to add a new route.
And before I do that let me just cut this and put it below the update campground road and now we'll
add in our destroy campground route terracing destroy is such a serious word for this.
I don't know why it doesn't work but you'll hear people use them interchangeably.
Technically destroy is is the term for restful routing.
I think the main idea is that it's just supposed to be a different name than the actual verb which is
delete so destroy.
I might have called it remove or something anyways.
So let's get started.
We need an app or a router.
Excuse me delete and then instead of here our route needs to be sashed campgrounds.
But remember we don't have to write such campgrounds because the way our routes are set up in the address
we're already adding sosh campgrounds in front of everything so it's just call an ID request in response
and let's just do a simple Redstart.
You are trying to delete something and then we need to hit that route which isn't that easy because
we actually have to make a form and we have to use method override.
So let's do that now.
On the show page under the edit button which we have right here let's add in a form and we can't just
do it with a link because we have to use a form to send a post request that has underscore method in
the row equal to delete.
So make a form and that form needs to have action and method method is post because that's what we have
to do for method override and the action needs to be slash campgrounds slash and then the ID which we
have with campground dot underscore ID and you could also just copy what we have here without the slash
at it.
So that's our form and then all that will add in the form is a button and it will have a class equal
to between ETN dashed danger and then able to say the least.
And that's all we should need to do.
Restart the server up refresh the page.
It's not styled very nicely will fix that and a little bit.
I'd like for them just to be side by side but because we have a form rather than just a link it's not
going to be in line so it takes up its the next line.
And if we click on delete right now stomack going to work because we're missing one key part which is
our question mark at the end.
Underscore method calls delete.
Now if we save and we go back try that again refresh.
Click on delete that now treats it as it delete request and we trigger this code you are trying to delete
something.
So now let's actually do eat something which is pretty easy.
Using mongoose instead of here we find by id and remove so campground that find by id and remove and
all that it takes is the ID which is request up harams ID and then we need to add in our callback with
an error and we'll just check if there is an error.
Doesn't really matter at this point.
We're going to redirect you really direct you to slash campgrounds grounds either way but it's good
to just have the code in place to handle the error even if we're not doing anything different.
So we'll send you back to campgrounds.
Of course we can't go to the show page because that hopefully that item has been deleted so there is
no show page anymore.
Let's give it a shot.
See what happens.
Restart the server whenever we change our routes.
Let's go back to sashed campgrounds.
Let's remove lovy creek and click on the.
There we go.
It's gone great so let's just make sure our edit and update still work.
Let's change this title some exclamation points.
Submit that works.
I want to delete it because we're running low on campgrounds but everything seems to be working just
fine.
The last thing we should do is style this so that our form buttons don't end up on separate lines.
And what's happening again is that this is wrapped in a form and a form is not an inline element so
it goes down to the next line as you can see if I select it correctly.
No I just deleted it.
Let me try that again make sure I don't do that this time.
There we go.
Here's the form.
Notice that it takes up the entire line.
When I hover over it what we can do is give it a display property of in line as he can see then it snaps
into line to do that.
Let's create an ID so we could just do style here and just say display in line which is really not a
good idea.
So we'll give it an ID and we'll call it delete form.
Just like that save.
Then we can go to our stylesheet public stylesheets main gutsiest us and we'll just add hash sign Octa
or delete Dasch form.
Display is in line so that it's treated like an inline element rather than inline block or block.
So let's try that.
Restart the server refresh the page and you don't notice a difference because I had already fixed it
in the last page before it refreshed but it's working now.
Every time I refresh the page.
Great.
So that's all I need to do to display them correctly to make them match up on the same line.
If we resize things still look good.
You could play around with the button sizes if you want to make them smaller.
Just use BT access right here if you prefer how that looks totally up to you of course.
Just take a look.
Looks a little nicer possibly the next step that we want to do is make sure that you only have permission
to edit and delete if you're logged in and you created this campground.
I don't want anyone to come in and be able to read it or edit it.
I only want potato head to be able to do that and there's a few steps involved there.
So one of them is just hiding the buttons.
If it doesn't belong to me.
So if I'm not potato head I shouldn't see these buttons but even if I did see them and I clicked on
one I should have some middleware that doesn't let me progress it doesn't let me at it.
It doesn't let me delete even if I am signed in.
So there's two layers of protection.
One is just not showing the buttons unless you own this campground and the other layer is done through
middleware So that's what will be up to in the next video.
I'll see you in a bit