Mostly, that's because the JavaScript code didn't detect the new item.
There're two possible solutions:
1- Instead of listening to an even on the element itself. You should listen to document events and check it's the element you want.
Example:
// Normal way
document.querySelector('.btn').addEventListener('click', () => // do something ..
// Solution for newly added elements
document.addEventListener('click', (e) => {
if( e.target.matches('.btn, .btn *')) {
// Do you logic
}
});
2- Firing an event from livewire to re-run the JavaScript code that's responsible of the drag-drop logic.
@MohamedTammam I have fired an event from Livewire to re-run the JS script, but it doesn't work.
Perhaps it's just because I load the script before the DOM is entirely reloaded with the last adde item.
I have searched around the Livewire JS API and tried to listen to the livewire:init or the livewire:initialize events, in both case the script is reloading, but the newly added item doesn't detect the dragover or the drop event.
