© 2026 Hedgehog Software, LLC

TwitterGitHubDiscord
More
CommunitiesDocsAboutTermsPrivacy
Search
Star
Setup for Free
FilamentF
Filament•13mo ago•
4 replies
Mostafa Amine

How to Control Filament Modal with JavaScript and Execute Custom Logic?

Hello, Filament Community!

I am working on a Filament project and need some guidance on controlling a Filament modal via JavaScript. Specifically, I want to listen to modal-related events (like when it opens or closes) and execute custom logic inside a script.

Here’s the code I’m currently using:

<x-filament-panels::page>
    <x-filament::modal id="edit-user">
        <x-slot name="trigger">
            <x-filament::button>
                Open modal
            </x-filament::button>
        </x-slot>
     
        <video id="preview"></video>
    </x-filament::modal>
</x-filament-panels::page>

<script>
    // Here I want to listen to the modal event and execute some logic
</script>
<x-filament-panels::page>
    <x-filament::modal id="edit-user">
        <x-slot name="trigger">
            <x-filament::button>
                Open modal
            </x-filament::button>
        </x-slot>
     
        <video id="preview"></video>
    </x-filament::modal>
</x-filament-panels::page>

<script>
    // Here I want to listen to the modal event and execute some logic
</script>


I’ve already gone through the documentation, but unfortunately, none of the approaches mentioned worked for me.

My main goals are:

- Detect when the modal is opened or closed.
- Execute JavaScript logic (e.g., interact with the <video> element inside the modal).

Any examples or pointers would be greatly appreciated.

Thank you in advance!
Modal Blade component - Core Concepts - Filament
Filament banner
FilamentJoin
A powerful open source UI framework for Laravel • Build and ship admin panels & apps fast with Livewire
20,307Members
Resources

Similar Threads

Was this page helpful?
Recent Announcements

Similar Threads

How to Control Filament Modal with JavaScript and Execute Custom Logic?
FilamentFFilament / ❓┊help
13mo ago
How to execute javascript within a modal
FilamentFFilament / ❓┊help
2y ago
Help with custom table and modal logic.
FilamentFFilament / ❓┊help
3y ago
Calling custom javascript function in custom filament modal
FilamentFFilament / ❓┊help
3y ago