I use a Bootstrap modal to create a popup and when it closes, all the click events of my documents are deleted, included the one I have just clicked. Could you help me, please?
To activate the modal, I click on a button with the id "btnAddPortfolio".
function initBtnPortfolioMainContentAddPortfolio(){
let btnAddPortfolio = document.getElementById("btnAddPortfolio");
btnAddPortfolio.addEventListener("click", () => {
displayPopUpLoadFileCreatePortfolio();
});
}
function displayPopUpLoadFileCreatePortfolio(){
let root = document.getElementById("root");
let html = [];
if (document.getElementById("PopUpLoadFileCreatePortfolio") === null){
html.push('<div id="PopUpLoadFileCreatePortfolio" class="modal" tabindex="-1">',
'<div class="modal-dialog modal-dialog-centered">',
'<div class="modal-content">',
'<div class="modal-header bg-info">',
'<h5 class="modal-title">Créer un nouveau portefeuille</h5>',
'<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>',
'</div>',
'<div class="modal-body">',
'<div class="mb-3">',
'<label for="formFile" class="form-label">Sélectionner le fichier à importer:</label>',
'<input class="form-control" type="file" id="formFile">',
'</div>',
'</div>',
'<div class="modal-footer">',
'<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annuler</button>',
'<button type="button" class="btn btn-primary">Valider</button>',
'</div>',
'</div>',
'</div>',
'</div>',
);
strHTML = html.join('\n');
root.innerHTML += strHTML;
}
let PopUp = new bootstrap.Modal(document.getElementById('PopUpLoadFileCreatePortfolio'), {
keyboard: false
});
PopUp.show();
}