200 votes

Comment puis-je afficher une liste de sélectionner la zone (liste déroulante) avec bootstrap?

Il n'y a rien hors de la zone qui bootstrap prend en charge à rendre un "régulier" de facto dans la liste déroulante sélectionner la zone? C'est là où la zone de liste déroulante est une liste de valeurs et si sélectionné remplit le contenu de la zone de liste?

Quelque chose de semblable à cette fonctionnalité?

http://vincentlamanna.com/BootstrapFormHelpers/select.html

enter image description here

419voto

IamSparticus Points 1390

Bootstrap 3 utilise l' .form-control classe de style des composants de formulaire.

<select class="form-control">
    <option value="one">One</option>
    <option value="two">Two</option>
    <option value="three">Three</option>
    <option value="four">Four</option>
    <option value="five">Five</option>
</select>

http://getbootstrap.com/css/#forms-controls

38voto

Skelly Points 27772

Une autre option est de faire le Bootstrap déroulante se comporter comme une sélection à l'aide de jQuery...

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

http://www.bootply.com/b4NKREUPkN

11voto

Ben Munson Points 51

Skelly est agréable et facile réponse est aujourd'hui obsolète avec les modifications apportées à la liste déroulante de la syntaxe dans Bootstap. Au lieu d'utiliser ceci:

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

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by: