livewire / flux

The official Livewire UI component library
380 stars 35 forks source link

How to capture Modal close event #271

Open azizabbas opened 15 hours ago

azizabbas commented 15 hours ago

Hi,

I was wondering if I can capture Modal close event.

For example, if I am using a Delete confirmation Modal. How I can capture click on little close icon on top right of the Modal?

Image

Thanks for your help and support so far.

Aziz Abbas

dayemsiddiqui commented 14 hours ago

Hi you can use wire:click and call your relevant livewire method when the close button is clicked

azizabbas commented 14 hours ago

Hi, Thanks for your reply on this one.

Actually, I am asking about that little cross icon on top-right corner of the box.

Seems like we don't have any control on that icon.

bzarzuela commented 12 hours ago

Caleb mentioned that he uses <dialog> for modals. If you can acquire a reference to it, you can add a listener as described in https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog#examples

azizabbas commented 11 hours ago

Are you saying that we have to go back to javascript to capture this is one tiny thing. Well, this is bit annoying

ju5t commented 3 hours ago

@azizabbas you could register an on click the data-flux-modal-close attribute too. It doesn't get much easier than that. And you can always override the the flux:modal.close to emit a JS event if it's more common.

This isn't a bug though, it's better to post these things in discussions.