I have i problem with my javascript code i make an application symfony with filter search to search (actif , inactif custumers), every things wirk fine with this filter form but when Ajax change my content in this content i have some buttons to inable & disable custumers if i use filter search with Ajax this buttons not work any more it's seems like the DOM not know the Elements of my html ? i put some of my code here Thank you all :
const cardClient = document.getElementById('clientCard')
if (cardClient){
for (let i = 0 ; i < cardClient.children.length ; i++){
const switchBtn = cardClient.children[i].getElementsByClassName('form-check-input')
const modalBtn = cardClient.children[i].getElementsByClassName('modal-footer')
const modalBody = cardClient.children[i].getElementsByClassName('modal-body')
const validBtn = modalBtn[0].children[1];
switchBtn[0].addEventListener('click',(e)=>{
e.preventDefault()
validBtn.addEventListener('click',()=>{
modalBody[0].innerHTML ="<div class=\"spinner-border text-primary\" role=\"status\">\n" +
"</div>"
axios.post('/client/'+validBtn.id+'/active', {
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
location.reload();
})
})
}
}