web-dev-qa-db-fra.com

Comment faire une liste déroulante Bootstrap nécessaire?

Donc, j'ai le code suivant pour une liste déroulante faite avec bootstrap:

<div class="btn-group">
    <button id="landKapitein" type="button" data-toggle="dropdown" class="btn btn-default dropdown-toggle">Land
        <span class="caret"></span>
    </button>
    <ul class="dropdown-menu">
        <li><a role="menuitem" tabindex="-1" href="#">België/Belgique</a></li>
        <li><a role="menuitem" tabindex="-1" href="#">Deutschland</a></li>
        <li><a role="menuitem" tabindex="-1" href="#">France</a></li>
        <li><a role="menuitem" tabindex="-1" href="#">Nederland</a></li>
        <li><a role="menuitem" tabindex="-1" href="#">United Kingdom</a></li>
     </ul>
</div>

Maintenant, je veux faire en sorte qu'il soit nécessaire de sélectionner quelque chose dans cette liste déroulante avant de pouvoir continuer. J'ai déjà fait cela pour les zones de texte et les boutons radio en ajoutant simplement required à la balise, mais je n'ai pas de balise comme celle-ci ici, alors comment puis-je faire cela?

htmltwitter-bootstrapdrop-down-menu
11
Venser

Si nous mettons simplement required dans les balises select et <option value="">None</option> dans les options, cela fonctionnera pour la validation. J'ai référé cette page . 

Cela fonctionne pour la sélection doit être faite parmi la valeur fournie. 

Mais je voudrais savoir comment écrire un message de validation personnalisé venant par défaut comme ce message.?  enter image description here 

 <form action="demo_form.asp">
    <select required>
      <option value="">None</option>
      <option value="volvo">Volvo</option>
      <option value="saab">Saab</option>
      <option value="mercedes">Mercedes</option>
      <option value="audi">Audi</option>
    </select>
    <input type="submit">
    </form>

Le code ci-dessus fonctionne bien pour la validation, comme "Sélectionner un élément de la liste avant de le soumettre".

9
Laxman G

Pourriez-vous simplement utiliser un élément select à la place et appliquer required à sa balise?

<select class="form-control" required>
    <option>België/Belgique</option>
    <option>Deutschland</option>
    <option>France</option>
    <option>Nederland</option>
    <option>United Kingdom</option>
</select>

Voir this SO question en particulier.

2
SamuelMS
<select class="form-control" required="required">
 <option>A</option>
 <option>A</option>
 <option>A</option>
</select>

veuillez définir required = "required" dans votre sélecteur 

0
Mihiraj Madhusanka

Utilisez ce code si vous souhaitez que la liste déroulante Bootstrap soit sélectionnée. 

<select id='terms' class='form-control' required>
    <option selected disabled>Select </option>
    <option value="Y">Yes</option>
    <option value="N">No</option>
</select>
0
alok