Dropstrap Dropdown gets the value of the selected item.

Question

Using the Bootstrap drop-down menu buttons, is there a way to show the value just selected?

<form action="/output/" name="InputCacheCheck" method="post"> {% csrf_token %} <div class="input-prepend input-append"> <div class="btn-group"> <button class="btn dropdown-toggle" name="recordinput" data-toggle="dropdown"> Record <span class="caret"></span> </button> <ul class="dropdown-menu"> <li><a href="#">A</a></li> <li><a href="#">CNAME</a></li> <li><a href="#">MX</a></li> <li><a href="#">PTR</a></li> </ul> <input class=".input-large" name="hostnameinput" id="appendedInputButton" type="text"> <button class="btn" type="submit">Lookup</button> </div> </div> </form> 

Also, record record records are not provided in POST data forms. Any ideas?

Answer 1

You should be able to change the drop-down text as follows.

 $(".dropdown-menu li a").click(function(){ var selText = $(this).text(); $(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="caret"></span>'); }); 

Demo http://www.bootply.com/64302

What does the POST form look like?

Answer 2

Or you can do it, like it ...

Using (documemt) .on seems to work more consistently than targeting the click event from the element class. In addition, by providing a button element, the identifier helps with the assignment of your choice in this case.

  $(document).on('click', '.dropdown-menu li a', function () { var selText = $(this).text(); $('#dLabel').html(selText + '<span class="caret"</span>'); }); <div class="dropdown"> <button type="button" class="btn btn-primary dropdown-toggle" id="dLabel" role="button" data-toggle="dropdown" data-target="#"> Lists <span class="caret"></span> </button> <ul id="drpdn_List" runat="server" class="dropdown-menu" role="menu" aria-labelledby="dropdownmenu"> </ul> </div> 

Answer 3

In this case, you should not use the Bootstrap dropdown list switch. This is useful to show one or more hyperlinks when the user presses / hangs the button.

If you want a dropdown style, you can use some other plugins, such as selectfx , which acts / returns a value, like a dropdown menu.