[JQUERY+BS3] ophalen value van (listed) dropdown

[Verwijderd]

Net niet genoeg Jquery kennis vrees ik voor het volgende:

We gebruiken de Bootstrap 3 dropdown en zouden graag de value (data-value van het dropdown-menu) uit de ul-class willen ophalen via Jquery.

Ik zal hieronder de code even posten:

HTML gedeelte:

code:

<div class="keep-open">
    <!-- Dropdown Button -->
    <button id="dLabel" role="button" href="#" data-toggle="dropdown" data-target="#" class="bttn">No privileges<span class="caret"></span>
    </button>
    
    <!-- Dropdown Menu -->

    <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
        <li><a href="#" class='dropdown-value' [b]data-value='0'[/b]>No privilege</a></li>
        <li><a href="#" class='dropdown-value' data-value='1'>Only my projects</a></li>
        <li class="divider"></li>
        <li><a href="#" class='dropdown-value' data-value='2'>All projects</a></li>
    </ul>
</div>

JQUERY gedeelte:

code:

<script>

$(function(){
    $('.dropdown-menu').click(function(e, dropdownData) {
        e.preventDefault();
        
        var value = $(this).attr('data-dropdown', dropdownData);
        
        alert('Een optie is aangeklikt'+value);
});

</script>

[marapuru]

Ik neem aan dat je van het aangeklikte A element de waarde uit het data-attribuut in de variabele value wilt zetten?

Misschien is het ook handig om je even te realiseren dat je niet met een dropdown menu werkt, maar met een lijst. Ik snap dat je Bootstrap gebruikt en dat het geheel omgetoverd wordt tot een dropdown menu, maar toch

In dat geval:

code:

<script>

$(function(){
    $('.dropdown-value').click(function(e, dropdownData) {
        e.preventDefault();
        
        var value = $(this).attr('data-value'); // Hier neemt ie de value over. Wat je eerder deed is de het data-dropdown attribuut vullen met een waarde.
        
        alert('Een optie is aangeklikt'+value);
});

</script>

[ Voor 32% gewijzigd door marapuru op 11-04-2014 21:13 ]

[marapuru]

Werkt het? Of is een update teveel van het goede?

[_Thanatos_]

Deze twee regels:

code:

var value = $(this).attr('data-value');
var value = $(this).data('value');

Zijn equivalent. Helpt niet bij het probleem, maar misschien wist @mrmali dit nog niet, en nu dus wel

[R4gnax]

_Thanatos_ schreef op donderdag 17 april 2014 @ 20:54:
Deze twee regels:

code:

var value = $(this).attr('data-value');
var value = $(this).data('value');

Zijn equivalent. Helpt niet bij het probleem, maar misschien wist @mrmali dit nog niet, en nu dus wel

Nee die regels zijn zeer beslist niet equivalent!

De eerste haalt direct de actuele string waarde van het attribuut data-value op.

De tweede haalt een waarde 'value' op uit een data store die via jQuery gekoppeld zit aan een element. Als dit de eerste access van die data store is, dan zal jQuery eerst het element controleren voor de aanwezigheid van data-* attributen. De library zal eenmalig de string waarde overnemen en zo mogelijk parseren als een ander type zoals een nummer of een complex object (in het geval de string op JSON lijkt) en daarna altijd die eenmalig geparseerde waarde terug geven.

[ Voor 3% gewijzigd door R4gnax op 17-04-2014 22:58 ]

[_Thanatos_]

equivalent!=identiek

For most intents and purposes, zijn ze uitwisselbaar. Voor andere gevallen, ken de verschillen inderdaad.

[ Voor 70% gewijzigd door _Thanatos_ op 21-04-2014 21:36 ]

[MoietyMe]

_Thanatos_ schreef op maandag 21 april 2014 @ 21:36:
equivalent!=identiek

For most intents and purposes, zijn ze uitwisselbaar. Voor andere gevallen, ken de verschillen inderdaad.

Maar werkt de oplossing dan?

[R4gnax]

_Thanatos_ schreef op maandag 21 april 2014 @ 21:36:
equivalent!=identiek

Equivalantie is gelijkwaardigheid en deze twee functie aanroepen zijn niet gelijkwaardig. Ze kunnen onder verschillende omstandigheden compleet andere resultaten geven.

Ze zijn hoogstens gelijkaardig, maar gezien data die terugkomt uit jQuery.fn.data helemaal niet met een data-* attribuut hoeft te corresponderen (sterker nog; dat is functionaliteit die er later pas bij geklust is...) is ook dat nog behoorlijk discutabel.

[/pedant]