Custom vanila JS within a modal (eWay payment popup form)
Hi Filament friends, long time laravel dev but new to filament.
This post really may just highlight my lack of knowledge with livewire and how to use it, so if there is a better way I am happy to learn!
I've made a wonderful dashboard so far, and have an eWay popup form for the payment provider. I have this working okay on a last wizard step, it is very hacky though. So on the last page of the wizard, we fire some vaninal JS to popup a form in an iframe to make a payment. It works okay for the most part, as the form will open when the page is loaded. Sometimes it will need a refresh to popup properly.
I am now trying to do the same for a 'bulk payment' action. So far that part is good, and I can construct the data, get this data in the view, send it to eWay, get the shared payment URL.
The bit I am stuck on is firing the actual event to popup the modal. I am trying to use an document.addEventListener("DOMContentLoaded", function(), to initialise the function eWayModal(),
Which then will eCrypt.showModalPayment(eWAYConfigBulk, resultCallbackBulk) to make the popup.
However all the things I have tried, the eWayModal() is an undefined function.
Some insights or a better approach on how to handle JS in this manner would be great! From what I can see the eWay js is included fine, the eCrypt module is there - if I manage to get this function eWayModal() to fire it is the last step for this. Thank you.
This post really may just highlight my lack of knowledge with livewire and how to use it, so if there is a better way I am happy to learn!
I've made a wonderful dashboard so far, and have an eWay popup form for the payment provider. I have this working okay on a last wizard step, it is very hacky though. So on the last page of the wizard, we fire some vaninal JS to popup a form in an iframe to make a payment. It works okay for the most part, as the form will open when the page is loaded. Sometimes it will need a refresh to popup properly.
I am now trying to do the same for a 'bulk payment' action. So far that part is good, and I can construct the data, get this data in the view, send it to eWay, get the shared payment URL.
The bit I am stuck on is firing the actual event to popup the modal. I am trying to use an document.addEventListener("DOMContentLoaded", function(), to initialise the function eWayModal(),
Which then will eCrypt.showModalPayment(eWAYConfigBulk, resultCallbackBulk) to make the popup.
However all the things I have tried, the eWayModal() is an undefined function.
Some insights or a better approach on how to handle JS in this manner would be great! From what I can see the eWay js is included fine, the eCrypt module is there - if I manage to get this function eWayModal() to fire it is the last step for this. Thank you.
Solution
I had just ended up moving this to its own page and now it works okay, as the DOMContentLoaded event can fire.
