Suche
Teilen
startseite » forum

[Frage] Bootstrap3-Menü mit collapse: Untermenü fährt aus und gleich wieder ein TYPO3-Version: 6.2.7

  • eddy eddy
    Sternenflotten-Admiral
    0 x
    177 Beiträge
    0 Hilfreiche Beiträge
    18. 02. 2015, 11:52

    Hallo zusammen,

    hier kurz die Problembeschreibung:
    Ich erstelle mittels Bootstrap3 ein einfaches TMENU, welches bei entsprechenden Unterseiten (mit collapse) das Untermenü auf Klick ausfahren und auf Klick wieder einfahren soll.

    Das Ausfahren auf Klick funktioniert, jedoch wird es sofort wieder automatisch eingefahren.

    Das Typoscript ist recht übersichtlich und sieht so aus:

    1. lib.sidenavi = HMENU
    2. lib.sidenavi {
    3.     entryLevel = 0
    4.     1 = TMENU
    5.     1 {
    6.         expAll = 0
    7.         wrap = <ul class="nav navbar-nav"> | </ul>
    8.         NO {
    9.             wrapItemAndSub = <li> | </li>
    11.             stdWrap.htmlSpecialChars.preserveEntities = 1
    12.         }
    13.  
    14.         ACT < .NO
    15.         ACT = 1
    16.         ACT {
    17.             wrapItemAndSub = <li> | </li>
    18.         }
    19.  
    20.         IFSUB = 1
    22.             wrapItemAndSub = <li>| </li>
    23.             stdWrap.wrap = | <span class="caret"></span>
    24.             ATagParams = data-toggle="collapse" data-target="#collapse1"
    25.         }
    26.  
    29.             wrapItemAndSub = <li class="active">|</li>
    30.         }
    31.     }
    32.  
    33.     2 < .1
    34.     2.wrap = <ul id="collapse1" class="nav collapse"> | </ul>
    35.     2.NO {
    36.         wrapItemAndSub = <li> | </li>
    37.     }
    38. }

    Eingebunden wird das ganze so im Template:

    1. <div class="collapse navbar-collapse  sidebar-navbar-collapse24">
    2. 	<f:cObject typoscriptObjectPath="lib.sidenavi"/>
    3. </div>

    Wenn ich im Template testweise ein Klickbutton mit den selben data-toggle und data-target einbaue funktioniert es wie gewünscht, also z.B.

    1. <div class="collapse navbar-collapse  sidebar-navbar-collapse24">
    2. <a data-toggle="collapse" data-target="#collapse1">Klick mich</a>
    3. <div id="collapse1" class="collapse">
    4.    Das wird ein und ausgeblendet
    5. </div>
    6. </div>

    Ehrlich gesagt ist mir völlig unklar, was das TMENU hier veranstaltet. Die entsprechende Klasse "collapse" wird auch auf Klick per JavaScript mit "collapse in" ausgetauscht, jedoch dann sofort wieder zurück zur Klasse "collapse", womit das Menü wieder einfährt.

    Kann mir hier jemand weiterhelfen bzw. habe ich etwas übersehen?
    Vielen Dank
    Eddy

    Tags: Bootstrap , Menu , Collapse
  • 1
  • jenses jenses
    Flash Gordon
    0 x
    3087 Beiträge
    106 Hilfreiche Beiträge
    19. 02. 2015, 05:25

    Blind geschossen - aber hast du eventuell mehrere Seiten auf der 2ten Ebene?
    Die würden ja alle die selbe ID zugeteilt bekommen (collapse1),
    und da kommt dann schon so manches Javascript aus dem Tritt...

  • eddy eddy
    Sternenflotten-Admiral
    0 x
    177 Beiträge
    0 Hilfreiche Beiträge
    19. 02. 2015, 09:30

    Hallo jenses,

    danke für die Antwort.
    Leider ist es das nicht. Habe mal den kompletten Code aus dem Layout geschmissen und nur den betreffenden Part getestet, also:

    1. <div class="collapse navbar-collapse  sidebar-navbar-collapse24">
    2.    <f:cObject typoscriptObjectPath="lib.sidenavi"/>
    3. </div>

    Und auch hier dieses merkwürdige Verhalten.

    Auch die Fehlerkonsole wirft keine Javascript-Fehler aus. Ich verstehe es nicht.
    Eddy

  • jenses jenses
    Flash Gordon
    0 x
    3087 Beiträge
    106 Hilfreiche Beiträge
    20. 02. 2015, 07:56

    Mit deiner lib.sidenavi erzeugst du ja aber auch etwas komplett anderes als den von dir genannten Code:

    1. <div class="collapse navbar-collapse sidebar-navbar-collapse24">
    2.     <a data-toggle="collapse" data-target="#collapse1">Klick mich</a>
    3.     <div id="collapse1" class="collapse">
    4.     Das wird ein und ausgeblendet
    5.     </div>
    6.     </div>

    Wo kann man die Seite sehen?
    So hier bringt das nichts, das ist mehr oder weniger nur Gerate...

  • eddy eddy
    Sternenflotten-Admiral
    0 x
    177 Beiträge
    0 Hilfreiche Beiträge
    20. 02. 2015, 09:32

    Dieser Passus mit dem "Klick mich" etc. hatte ich nur als Testalternative genommen, um die Funktionalität zu testen. Wie beschrieben, hat es da funktioniert.

    Hab es dann natürlich wieder entfernt und nur diesen Abschnitt im Layout stehen:

    1. <div class="collapse navbar-collapse sidebar-navbar-collapse24">
    2.   <f:cObject typoscriptObjectPath="lib.sidenavi"/>
    3. </div>

    mehr ist da nicht.

    Hinweis:
    Das ganze ist nicht online und läuft nur auf einer lokalen Maschine.

  • 1
Präsentiert von