© 2026 Hedgehog Software, LLC

TwitterGitHubDiscord
More
CommunitiesDocsAboutTermsPrivacy
Search
Star
Setup for Free
FilamentF
Filament•3y ago•
2 replies
Neil Kerman

Custom JS script inside modalContent

Hi there, I am trying to create a modal, opening which will have some custom JS that shall run to take data from user.

Here's the code that will trigger the modal:
Components\TextInput::make('barcode')
                    ->columnSpan(2)
                    ->label("Barcode (UAN, EAN, ISBN, etc)")
                    ->suffixActions([
                        Components\Actions\Action::make('barcodeScanner')
                            ->icon('heroicon-m-camera')
                            ->modalContent(fn (Components\Actions\Action $action): View =>                                   view('control.modals.barcode_scanner',
                                ['action' => $action],
                               ))
                    ]),
Components\TextInput::make('barcode')
                    ->columnSpan(2)
                    ->label("Barcode (UAN, EAN, ISBN, etc)")
                    ->suffixActions([
                        Components\Actions\Action::make('barcodeScanner')
                            ->icon('heroicon-m-camera')
                            ->modalContent(fn (Components\Actions\Action $action): View =>                                   view('control.modals.barcode_scanner',
                                ['action' => $action],
                               ))
                    ]),


The view "control.modals.barcode_scanner" has the following code:

<div>
    <div id="scanner"></div>

    <script src="{{ asset('js/quagga.min.js') }}"></script>
    <script>
        // Custom JS Script
    </script>
 
</div>
<div>
    <div id="scanner"></div>

    <script src="{{ asset('js/quagga.min.js') }}"></script>
    <script>
        // Custom JS Script
    </script>
 
</div>


But I do see the script element in the DOM but the js inside does not run. Someone kindly help me with this.

Thanks and regards!
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

Load custom vue js component to modalContent
FilamentFFilament / ❓┊help
3y ago
How to custom footer button in modalContent?
FilamentFFilament / ❓┊help
3y ago
script in modalContent(view('qr-scanner.php')) not working
FilamentFFilament / ❓┊help
17mo ago
Cannot load <script type="module"> inside a custom form field
FilamentFFilament / ❓┊help
2y ago