• Forum
• TYPO3 CMS: TypoScript
• Menüs
• Bootstrap3-Menü mit collapse: UntermenÃ...

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

• eddy
  Sternenflotten-Admiral

  0 x

  177	Beiträge
  0	Hilfreiche Beiträge

  • Facebook
  • Twitter

  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:

  lib.sidenavi = HMENU
  lib.sidenavi {
      entryLevel = 0
      1 = TMENU
      1 {
          expAll = 0
          wrap = <ul class="nav navbar-nav"> | </ul>
          NO {
              wrapItemAndSub = <li> | </li>
              stdWrap.htmlSpecialChars = 1
              stdWrap.htmlSpecialChars.preserveEntities = 1
          }
   
          ACT < .NO
          ACT = 1
          ACT {
              wrapItemAndSub = <li> | </li>
          }
   
          IFSUB = 1
          IFSUB {
              wrapItemAndSub = <li>| </li>
              stdWrap.wrap = | <span class="caret"></span>
              ATagParams = data-toggle="collapse" data-target="#collapse1"
          }
   
          ACTIFSUB < .IFSUB
          ACTIFSUB {
              wrapItemAndSub = <li class="active">|</li>
          }
      }
   
      2 < .1
      2.wrap = <ul id="collapse1" class="nav collapse"> | </ul>
      2.NO {
          wrapItemAndSub = <li> | </li>
      }
  }

  Eingebunden wird das ganze so im Template:

  <div class="collapse navbar-collapse  sidebar-navbar-collapse24">
  	<f:cObject typoscriptObjectPath="lib.sidenavi"/>
  </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.

  <div class="collapse navbar-collapse  sidebar-navbar-collapse24">
  <a data-toggle="collapse" data-target="#collapse1">Klick mich</a>
  <div id="collapse1" class="collapse">
     Das wird ein und ausgeblendet
  </div>
  </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
  Flash Gordon

  0 x

  3087	Beiträge
  106	Hilfreiche Beiträge

  • Facebook
  • Twitter

  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
  Sternenflotten-Admiral

  0 x

  177	Beiträge
  0	Hilfreiche Beiträge

  • Facebook
  • Twitter

  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:

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

  Und auch hier dieses merkwürdige Verhalten.

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

• jenses
  Flash Gordon

  0 x

  3087	Beiträge
  106	Hilfreiche Beiträge

  • Facebook
  • Twitter

  20. 02. 2015, 07:56

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

  <div class="collapse navbar-collapse sidebar-navbar-collapse24">
      <a data-toggle="collapse" data-target="#collapse1">Klick mich</a>
      <div id="collapse1" class="collapse">
      Das wird ein und ausgeblendet
      </div>
      </div>

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

• eddy
  Sternenflotten-Admiral

  0 x

  177	Beiträge
  0	Hilfreiche Beiträge

  • Facebook
  • Twitter

  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:
  

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

  
  mehr ist da nicht.

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

• 1

• Zurück