Merge pull request #2326 from cisagov/rjm/delete-request-bug

Fix delete request bug to ensure event listeners are not duplicated
This commit is contained in:
Rachid Mrad 2024-06-20 19:02:07 -04:00 committed by GitHub
commit 227d378f8d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -33,6 +33,33 @@ const showElement = (element) => {
element.classList.remove('display-none');
};
/**
* Helper function that scrolls to an element
* @param {string} attributeName - The string "class" or "id"
* @param {string} attributeValue - The class or id name
*/
function ScrollToElement(attributeName, attributeValue) {
let targetEl = null;
if (attributeName === 'class') {
targetEl = document.getElementsByClassName(attributeValue)[0];
} else if (attributeName === 'id') {
targetEl = document.getElementById(attributeValue);
} else {
console.log('Error: unknown attribute name provided.');
return; // Exit the function if an invalid attributeName is provided
}
if (targetEl) {
const rect = targetEl.getBoundingClientRect();
const scrollTop = window.scrollY || document.documentElement.scrollTop;
window.scrollTo({
top: rect.top + scrollTop,
behavior: 'smooth' // Optional: for smooth scrolling
});
}
}
/** Makes an element invisible. */
function makeHidden(el) {
el.style.position = "absolute";
@ -895,33 +922,6 @@ function unloadModals() {
window.modal.off();
}
/**
* Helper function that scrolls to an element
* @param {string} attributeName - The string "class" or "id"
* @param {string} attributeValue - The class or id name
*/
function ScrollToElement(attributeName, attributeValue) {
let targetEl = null;
if (attributeName === 'class') {
targetEl = document.getElementsByClassName(attributeValue)[0];
} else if (attributeName === 'id') {
targetEl = document.getElementById(attributeValue);
} else {
console.log('Error: unknown attribute name provided.');
return; // Exit the function if an invalid attributeName is provided
}
if (targetEl) {
const rect = targetEl.getBoundingClientRect();
const scrollTop = window.scrollY || document.documentElement.scrollTop;
window.scrollTo({
top: rect.top + scrollTop,
behavior: 'smooth' // Optional: for smooth scrolling
});
}
}
/**
* Generalized function to update pagination for a list.
* @param {string} itemName - The name displayed in the counter
@ -1294,6 +1294,10 @@ document.addEventListener('DOMContentLoaded', function() {
* @param {*} pageToDisplay - If we're deleting the last item on a page that is not page 1, we'll need to display the previous page
*/
function deleteDomainRequest(domainRequestPk,pageToDisplay) {
// Use to debug uswds modal issues
//console.log('deleteDomainRequest')
// Get csrf token
const csrfToken = getCsrfToken();
// Create FormData object and append the CSRF token
@ -1348,6 +1352,14 @@ document.addEventListener('DOMContentLoaded', function() {
const tbody = document.querySelector('.domain-requests__table tbody');
tbody.innerHTML = '';
// Unload modals will re-inject the DOM with the initial placeholders to allow for .on() in regular use cases
// We do NOT want that as it will cause multiple placeholders and therefore multiple inits on delete,
// which will cause bad delete requests to be sent.
const preExistingModalPlaceholders = document.querySelectorAll('[data-placeholder-for^="toggle-delete-domain-alert"]');
preExistingModalPlaceholders.forEach(element => {
element.remove();
});
// remove any existing modal elements from the DOM so they can be properly re-initialized
// after the DOM content changes and there are new delete modal buttons added
unloadModals();
@ -1469,7 +1481,7 @@ document.addEventListener('DOMContentLoaded', function() {
</svg>
</button>
</div>
`
`
domainRequestsSectionWrapper.appendChild(modal);
}