Fix selection credentials when click checkbox icon

wwWallet · Apr 9, 2024 · 53dd186 · 53dd186
1 parent 758a805
commit 53dd186
Showing 1 changed file with 25 additions and 17 deletions.
diff --git a/public/js/consent.js b/public/js/consent.js
@@ -11,7 +11,6 @@ setTimeout(() => {
 const layout = document.querySelector('.layout');
 
 const cards = document.querySelectorAll('.credential-card');
-const selectCard = document.querySelectorAll('.toggle-card');
 const toggleButtons = document.querySelectorAll('.toggle-details');
 
 const form = document.querySelector('#DiplomaSelection');
@@ -72,28 +71,37 @@ function checkCardSelection() {
 	}
 }
 
-// Attach event listeners to each card for the 'click' event
-selectCard.forEach(selectCard => {
-	selectCard.addEventListener('click', (e) => {
-		const button = e.target.closest('.toggle-card');
-		const thisId = e.target.id;
-		if (button) {
-			const isSelectedIcon = button.querySelector('.is-selected');
-			const isNotSelectedIcon = button.querySelector('.is-not-selected');
-			button.classList.toggle('selected');
-			if(layout.classList.contains('multi')) {
-				toggleInput(thisId);
-			}
-			isSelectedIcon.style.display = isSelectedIcon.style.display === 'none' ? 'inline' : 'none';
-			isNotSelectedIcon.style.display = isNotSelectedIcon.style.display === 'none' ? 'inline' : 'none';
+document.addEventListener('click', (e) => {
+	let targetElement = e.target;
+
+	if (targetElement.matches('.is-selected, .is-not-selected')) {
+		targetElement = targetElement.closest('.toggle-card');
+	} else if (!targetElement.matches('.toggle-card')) {
+		return;
+	}
 
-			checkCardSelection();
+	const button = targetElement;
+	const thisId = button.id;
+
+	if (button) {
+		const isSelectedIcon = button.querySelector('.is-selected');
+		const isNotSelectedIcon = button.querySelector('.is-not-selected');
+		button.classList.toggle('selected');
+
+		if(layout.classList.contains('multi')) {
+				toggleInput(thisId);
 		}
-	});
+
+		isSelectedIcon.style.display = isSelectedIcon.style.display === 'none' ? 'inline' : 'none';
+		isNotSelectedIcon.style.display = isNotSelectedIcon.style.display === 'none' ? 'inline' : 'none';
+
+		checkCardSelection();
+	}
 });
 
 
 
+
 toggleButtons.forEach(toggleButton => {
 	toggleButton.addEventListener('click', (e) => {