Permalänk
Medlem

TwitterBootstrap 3 - .dropdown()

Sitter och pillar lite med TB och jag kanske har missuppfattat hela grejen men:

Man ska kunna trigga dropdown antingen via data attributes eller via javascript: http://getbootstrap.com/javascript/#dropdowns

vad är det jag kan ta bort i form av data attributes när jag kör dropdown via javascript, har försökt leta exempel på detta, men de jag har hittat har ändå haft med alla de data-attribut som gör att dropdownen skulle fungera utan javascript...

någon som skulle kunna kasta lite ljus över detta, alltså: vad kan jag ta bort från data-attribut-sättet när jag använder javascript/jquery sättet att toggla exemplevis dropdowns med samma funktionalitet som med data-attributes.

(Tar jag bort data-toggle="dropdown" från anchor så fungerar inte dropdownen utan javascript, lägger jag till javascript så går det att få dropdown men den stängs inte, dvs verkar inte finnas någon backdrop som stänger vid klick utanför ej heller vi klick på, som fungerar när man kör endast data-attribute sättet)

väsentlig markup:

<a href="#" class="dropdown-toggle" data-toggle="dropdown" >Dropdown <b class="caret"></b></a>

väsentlig javascript/jquery mellan </body> och </html> efter att jquery och boostrap har sourcats in:

<script> $('.dropdown-toggle').dropdown() </script>

/hanto899

Permalänk
Medlem

Rätta mig om jag har fel. Jag tror detta beror på att meningen med TB är att det ska fungerar på alla enheter. Och på till exempel mobiler går det ju inte med .mouseOver() och liknande funktioner därför krävs det att man måste klicka!

Edit: Hade inte läst ditt inlägg ordentligt, men ovanstående kanske kan vara intressant ändå

Permalänk
Medlem

@simowewe mjo, att det finns två varianter av hur man triggar dropdown är jag med på, och att det på vissa enheter fungerar bättre med ena eller andra.

Men min fråga kvarstår: hur triggar jag dropdown med enbart javascriptet så att det blir samma funktionalitet som vid "triggning" via data-attributes.
Som sagt, tar jag bort data-toggle="dropdown" från anchor och istället lägger till javascriptet $('.classSomFinnsIAnchor').dropdown(); så "droppar" den, men den beter sig inte likadant som när man kör med data-toggle="dropdown".

Så, vad behöver jag göra för att de ska bete sig likadant. Förklaringen på http://getbootstrap.com/javascript/#dropdowns hjälper mig inte så mycket, så jag tänkte att det kanske finns någon här som vet?

/hanto899

Permalänk
Medlem

Ok, så jag hittade detta:

http://www.tutorialrepublic.com/codelab.php?topic=bootstrap&f...

men när jag kopierar in koden och kör lokalt så får jag samma problem som innan, att dropdownen inte stänger sig, men det verkar ju fungera i codelab fönstret.

Och i detta exempel körs dropdownen enbart med javascript och inga data-attributes, precis som jag vill... någon som kan kolla om det funkar lokalt hos er om ni har TB css:er och .js filer...

/hanto899

Permalänk
Medlem

Hittade detta som kanske kan lösa ditt problem:

http://getbootstrap.com/2.3.2/javascript.html#dropdowns
Från förra versionen 2.3.2 men kanske lever kvar! Där man kan addera $().dropdown('toggle');

Antar att detta beror på eftersom din data-toggle="dropdown" är till just för att "toggling" ska fungera och inte själva dropdownen.