Sæt navigation url for specifikke faneblade

CodingPirates · Aug 20, 2023 · 27f4347 · 27f4347
1 parent f5317e6
commit 27f4347
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 7 deletions.
diff --git a/members/static/members/js/tab.js b/members/static/members/js/tab.js
@@ -13,7 +13,8 @@ document.addEventListener("DOMContentLoaded", function(event) {
     const urlFragment = window.location.hash.substring(1); // Remove the '#' char
 
     // Default to the first list item as active if the ID is not provided or doesn't match any item
-    const activeIndex = tabButtons.findIndex(button => button.id === urlFragment);
+    // we use custom attribute data-navigation to set the "navigation url" for tab
+    const activeIndex = tabButtons.findIndex(button => button.dataset.navigation === urlFragment);
     const defaultIndex = activeIndex !== -1 ? activeIndex : 0;
 
     // Default to first as active
@@ -38,6 +39,9 @@ function toggleActive(sections, buttons, activeIndex) {
   sections[activeIndex].hidden = false;
 
   // set url to include the tab identifier. we overwrite url, since tabs doesn't work otherwise
-  const newUrl = window.location.pathname + `#${buttons[activeIndex].id}`;
-  window.history.replaceState({}, "", newUrl);
+  // we use custom attribute data-navigation to set the url for tab
+  if (buttons[activeIndex].dataset.navigation) {
+    const newUrl = window.location.pathname + `#${buttons[activeIndex].dataset.navigation}`;
+    window.history.replaceState({}, "", newUrl);
+  }
 }
diff --git a/members/templates/members/activities.html b/members/templates/members/activities.html
@@ -15,11 +15,11 @@ <h2>Aktiviteter i Coding Pirates</h2>
   <div class="tabs" id="tab-menu">
     <ul>
       {% if family %}
-        <li id="tab-invitationer">Invitationer</li>
+        <li id="tab-invitationer" data-navigation="invitationer">Invitationer</li>
       {% endif %}
-      <li id="tab-aktiviteter">Nuværende og kommende aktiviteter</li>
+      <li id="tab-aktiviteter" data-navigation="aktiviteter">Nuværende og kommende aktiviteter</li>
       {% if family %}
-        <li id="tab-tilmeldte-aktiviteter">Tilmeldte aktiviteter</li>
+        <li id="tab-tilmeldte-aktiviteter" data-navigation="tilmeldte-aktiviteter">Tilmeldte aktiviteter</li>
       {% endif %}
       </ul>
 

diff --git a/members/views/ActivitySignup.py b/members/views/ActivitySignup.py
@@ -148,7 +148,7 @@ def ActivitySignup(request, activity_id, person_id=None):
             participant.save()
 
             # return user to list of activities where they are participating
-            return_link_url = f'{reverse("activities")}#tab-tilmeldte-aktiviteter'
+            return_link_url = f'{reverse("activities")}#tilmeldte-aktiviteter'
 
             # Make payment if activity costs
             if activity.price_in_dkk is not None and activity.price_in_dkk > 0: