eventlisteners not working
I added an event listener to a button in a cell, but the event is never triggered. The table is being rendered inside a swal2 modal, and it works when I remove the datatables. Once the modal is rendered I do a querySelectorAll and then a foreach to do addEventListener("onclick", () => {}) on each element.
I added an event listener to a button in a cell, but the event is never triggered. The table is being rendered inside a swal2 modal, and it works when I remove the datatables. Once the modal is rendered I do a querySelectorAll and then a foreach to do addEventListener("onclick", () => {}) on each element.
Facing the same issue, any solution yet?
I ended up doing:
datatable.on('datatable.init', function (){
var buttons = document.querySelectorAll('.dataTableParent button')
buttons.forEach(function(button) {
button.addEventListener('click', function (){
... your button action here
})
})
})
I'm also not sure of any other way around this.
I ran into this issue as well trying to use HTMX on an rendered inside the data table. Took me awhile to figure out that the issue was not my HTMX but the event triggering for the data table itself. It works fine once I remove the datatable. I will try the work arounds above as well as look deeper intot the simiple datatables code to see if I can find a more general solution.
Any workaround for this?
Welp! Was trying to make a NuxtJS module out of this and ran into this issue.
Any help/ideas on how we can fix this? @johanneswilm
Yeah, I don't think that is easily solvable like that. I would put the event listeners on an element outside the table l, wait for the event to bubble and then find the original element using event.target.
That may mean that it's not really compatible with some frameworks like react &co.
Ohhh. Ok, thanks 😄