Einzelnen Beitrag anzeigen

Yheeky

Registriert seit: 7. Jun 2002
1.339 Beiträge
 
#1

[HTML, Javascript] Tabs und SubTabs realisieren

  Alt 31. Mär 2010, 08:51
Hi,

ich habe folgendes Problem: ich habe ein ASP-Projekt mit einer Masterseite. Auf der Masterseite habe ich folgende Struktur, die mir eine Tab-Navigation ermöglicht:

Code:
<div id="Tabs">
   <ul id="MainTabs">
      [*][url="#Users"]Users[/url]
      [*][url="#Products"]Products[/url]
   [/list]   <div id="Users">
      <div id="SubTabs">
         <a href ="/CreateUser"><div id="SubTabUserCreate">Create user</div></a>
              <a href ="/EditUser"><div id="SubTabUserEdit">Edit user</div></a>
                  <a href ="/DeleteUser"><div id="SubTabUserDelete">Delete user</div></a>
           </div>
   </div>
   <div id="Products">
      <div id="SubTabs">
         <a href ="/CreateProduct"><div id="SubTabProductCreate">Create product</div></a>
                  <a href ="/EditProduct"><div id="SubTabProductEdit">Edit product</div></a>
                  <a href ="/DeleteProduct"><div id="SubTabProductDelete">Delete product</div></a>
           </div>
   </div>
</div>
Über ein JavaScript auf meiner Masterseite, lasse ich bei einem Klick auf die Tabs ("div id 'Users'" und "div id='Products'") die jeweiligen Unter-Divs sichtbar machen. Das JavaScript sieht so aus:

Code:
<script type="text/javascript">
        $(function () {
            var tabContainers = $('div#Tabs > div');
   
            $('div#Tabs ul#MainTabs a').click(function () {
                tabContainers.hide().filter(this.hash).fadeIn();
       
                $('div#Tabs ul#MainTabs a').removeClass('selected');
                $(this).addClass('selected');
            });
        });
    </script>
Wenn ich nun auf einer Unterseite wechsele, möchte ich, dass trotzdem das betreffende Tab zur Auswahl steht, also aufgerufen wird. Beispiel:
Auf meiner User-Seite werden ja ohnehin die Tabs angezeigt, weil sie auf der Masters-Seite sind. Ich möchte nun aber, dass auch die betreffenden User-Tabs aufgeklappt sind. Dies habe ich mit folgendem Script auf der User-Seite versucht:

Code:
<script type="text/javascript">
    $(function() {
        $('div#Tabs ul#MainTabs div#Users').click();
    });
</script>
Leider funktioniert das aber so nicht. Hat jemand eine Idee, wie ich den Code umschreiben muss, damit er funktioniert?
Falls es (Verständnis)-Fragen gibt, einfach Fragen

Danke schonmal im Vorraus!

Crosslink von gestern aus einem anderen Forum
  Mit Zitat antworten Zitat