F
Filament12mo ago
rich06

Use custom javascript for a modal edit form?

I am using the Filament admin package and am using modal create/edit forms for user resource maintenance. In order to provide a better UI experience I would like to use a custom JS library for the contact phone number input field. I know I can inject custom JS/CSS when Filament boots up however I need to bind the JS function to the input field once the modal has been opened so is there a 'modal-open' (or similar) event I can create a listener for?
5 Replies
Patrick Boivin
Patrick Boivin12mo ago
You may be able to use a simple ViewField : https://filamentphp.com/docs/2.x/forms/fields#view You can load your JS library like this : https://filamentphp.com/docs/2.x/admin/appearance#including-frontend-assets and use an x-init attribute on your field to initialize it
awcodes
awcodes12mo ago
What are you trying to do. If it’s just a mask then v3 is switching to alpines native masking. And it’s a lot better.
rich06
rich0612mo ago
Trying to use this module in the admin area https://intl-tel-input.com/
International Telephone Input
International Telephone Input - a JavaScript plugin for entering international telephone numbers.
rich06
rich0612mo ago
Okay - I will look at building a custom component field. Thanks.
awcodes
awcodes12mo ago
ah, yea, you'll probably need a need a custom component then.