Twitter Bootstrap: How do I get the selected value of dropdown?

Question

I need to get the value a user selects from a twitter bootstrap dropdown. Once the user selects a value I want the dropdown to display that value. So, the user selects \'pending

Answer 1

Bootstrap provides you with minimum required functionality for your implementation, they aren't dropdowns instead they are mere ul, li's with css applied on it and some events registered in the bootstrap plugin for toggling the button to display them as dropdown. This one you need to do on your own.

Set up some identifier to the status button say a className btnStatus and bind a click event to the dropdown links. and do something like this?

$('.dropdown-inverse li > a').click(function(e){
    $('.btnStatus').text(this.innerHTML);
});

Demo

Answer 2

I had the same issue. The solution is pretty easy and I think the answers above may be overcomplicating a bit.

Just use $(this).text()

Assign a class name to the "" bit then..

$(".yourUlClassName li a").click( function() {
    var yourText = $(this).text();
});

Answer 3

you can try this:

u can use class or id for selector to select easier the element. for use the value also u can use the value in u javascript with jQuery.

    $().ready(function(){
        $('a').click(function(){
            var value = $(this).text();
            alert(value);
        });
    });

Demo: http://jsfiddle.net/mr_mohsen_rasouli/A8m39/

Answer 4

Try like this -

$(document.body).on('click', '.dropdown-menu li a', function (e) {
    alert($(this).text());
});

Demo - Fiddle