From 4eb2fabc9ace54e18e43cccc10e39bced33fc1b2 Mon Sep 17 00:00:00 2001 From: Lunix-420 Date: Thu, 14 Nov 2024 20:41:17 +0100 Subject: [PATCH] fix: Multi skill add delete button implemented --- .../static/js/skills/skillSelector.js | 48 +++++++++++++++++++ .../fragments/skills/_skillSelector.html | 12 ++++- 2 files changed, 58 insertions(+), 2 deletions(-) diff --git a/src/main/resources/static/js/skills/skillSelector.js b/src/main/resources/static/js/skills/skillSelector.js index 881a459..33bc2f1 100644 --- a/src/main/resources/static/js/skills/skillSelector.js +++ b/src/main/resources/static/js/skills/skillSelector.js @@ -28,4 +28,52 @@ function handleSecondarySkillSelection(selectElement) { // Initialize star rating components for the new skill selector initializeStarRatingComponents(); + + // Update the visibility of the "Entfernen" buttons + updateRemoveButtonsVisibility(); } + +function updateRemoveButtonsVisibility() { + const skillSelectors = document.querySelectorAll(".skill-selector"); + const removeButtons = document.querySelectorAll(".btn-default"); + + // Show "Entfernen" buttons only if there are at least two skill selectors + if (skillSelectors.length > 1) { + removeButtons.forEach((button) => { + const selectElement = button + .closest(".skill-selector") + .querySelector("#secondarySkill"); + if (selectElement.value) { + button.style.display = "inline-block"; + } else { + button.style.display = "none"; + } + }); + } else { + removeButtons.forEach((button) => { + button.style.display = "none"; + }); + } +} + +function handleRemoveSkillButtonClick(button) { + const skillSelector = button.closest(".skill-selector"); + skillSelector.remove(); + updateRemoveButtonsVisibility(); +} + +document.addEventListener("DOMContentLoaded", function () { + // Initialize star rating components on page load + initializeStarRatingComponents(); + + // Update the visibility of the "Entfernen" buttons on page load + updateRemoveButtonsVisibility(); + + // Add event listeners to "Entfernen" buttons + document.querySelectorAll(".btn-default").forEach((button) => { + button.addEventListener("click", function (event) { + event.preventDefault(); + handleRemoveSkillButtonClick(button); + }); + }); +}); diff --git a/src/main/resources/templates/fragments/skills/_skillSelector.html b/src/main/resources/templates/fragments/skills/_skillSelector.html index 35b9068..165069c 100644 --- a/src/main/resources/templates/fragments/skills/_skillSelector.html +++ b/src/main/resources/templates/fragments/skills/_skillSelector.html @@ -1,6 +1,6 @@ -
+
@@ -35,7 +35,15 @@
- +
+