Alright, I got a little JavaScript Swiss Army knife feature for you that actually exists in V three, but we souped it up a tiny bit and it's just worth repeating. This is the dollar sign JS magic property. I'll show it to you. Let's take a look. So here's our edit post component. I added a delete button so that you can delete a post, but that's a pretty dangerous action that doesn't show any form of confirmation.

but that's a pretty dangerous action that doesn't show any form of confirmation. So let's use this as an opportunity to use that JS feature. Alright, so we scroll down, we have this button called delete that calls wire click delete. Now in live wire three even there's a nice little feature called wire confirm where you can say, are you sure? And now live wire will do it all for you and you could say cancel and it won't work.

And now live wire will do it all for you and you could say cancel and it won't work. Or you can say okay and it will work and this is great, but uh, it's uh, it's more fun to build it ourselves to show you this feature. Okay, so watch this instead of wire, click delete. Let's not actually directly call the delete action instead let's say JS delete post or something like that. Okay? Then down here in our script tag we can say this Js delete post equals and then put anything we want.

Okay? Then down here in our script tag we can say this Js delete post equals and then put anything we want. So this JS feature, this dollar sign js feature here, this is a gateway between your template and your script and it's incredibly useful 'cause there are other ways to do this. You could dispatch an event and listen for the event. There's probably even other things I'm not even thinking about. But this is just really great

things I'm not even thinking about. But this is just really great because it's like if you just want functionality that you wanna author inside your JavaScript but you want to call it or reference it from inside your template, this is a nice really easy way to do that. So now in delete post we could say if confirm, are you sure you want to delete the great post you have? And then if they say yes, then we just call delete

are you sure you want to delete the great post you have? And then if they say yes, then we just call delete or to tell, we call delete and then it actually works. If they cancel out of the confirmation, this will return False of course, maybe again you'd probably use wire confirm, but the reason I'm demonstrating this is a lot of times like I think that alert is actually pretty good. Like you might see it and go, uh, that looks like trash and it sort of does,

Like you might see it and go, uh, that looks like trash and it sort of does, but it's native to the browser so it's totally accessible. Users sort of expect it, they see it even on pro applications. GitHub uses this at times and on mobile it, it shows like a really nice reliable confirmation, uh, modal. So I think it is actually fine,

confirmation, uh, modal. So I think it is actually fine, but you may want to have a nicer confirmation modal and you can trigger that from something like this. But again, we're just gonna use this simple confirm. Okay, so now I hit delete and there we go. Are you sure you wanna delete the great post you have? No, I'm not sure. Or if I am sure I hit okay and then it does delete it. Okay, so that's super handy.

and then it does delete it. Okay, so that's super handy. Let me show you the other way that you can use js. So if we define something down here like this JS show update success or something, okay, show update success and then we'll set this to be a method. And here we'll just do more alerts because they're easy to do. We'll say post successfully updated. Okay, so now let's say that when a user hits update post,

We'll say post successfully updated. Okay, so now let's say that when a user hits update post, it submits the form, it goes up here, it saves it in the database. And right now we're just redirecting. But let's say we don't wanna redirect and instead from the server, we wanna call this show update post function in JavaScript. It's super easy. We just say this arrow js you pass and show update success.

It's super easy. We just say this arrow js you pass and show update success. And now if we hit delete, nope, if we hit update post, it says post successfully updated, how awesome is that? And if we fail validation, it's not gonna hit that JS at all. Right? Okay, so that's JS in a nutshell. Nice little Swiss army knife tool and it Baird board Bard repeating. Um, I'll see in the next one.

and it Baird board Bard repeating. Um, I'll see in the next one.