Html 如何制作需要的 Bootstrap 下拉菜单？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/28927772/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to make a Bootstrap dropdown required?
提问by Venser
So, I've got following code for a dropdown box made with 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>
Now I want to make it required to select something from this dropdown box before you can continue on. I've already done this for textboxes and radio buttons by just adding requiredto the tag, but I don't have a tag like that here, so how do I do this then?
现在我想让它需要从这个下拉框中选择一些东西，然后才能继续。我已经通过向标签添加required来为文本框和单选按钮完成此操作，但我这里没有这样的标签，那么我该怎么做呢？
回答by Laxman G
If we just put required in select tag and <option value="">None</option>in the option it will work for validation. I have refer this page.
如果我们只是将 required 放在 select 标签和 <option value="">None</option>选项中，它将用于验证。我已经参考了这个页面。
It works for selection must be made among provided value.
它适用于必须在提供的值中进行选择。
But I would like to know how to write custom validation message coming by default like this message.? 
但我想知道如何编写默认情况下出现的自定义验证消息，如此消息。？
<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>
Above code works fine for validation like "Selecting an item in the list before submit".
上面的代码适用于“在提交前选择列表中的项目”之类的验证。
回答by SamuelMS
Could you just use a select elementinstead and apply required to its tag?
你能不能只使用一个select 元素并将 required 应用到它的标签上？
<select class="form-control" required>
<option>Belgi?/Belgique</option>
<option>Deutschland</option>
<option>France</option>
<option>Nederland</option>
<option>United Kingdom</option>
</select>
See this SO questionin particular.
请特别参阅此 SO 问题。
回答by alok
Use this code if you want to required Bootstrap drop down select
如果您想要需要 Bootstrap 下拉选择，请使用此代码
<select id='terms' class='form-control' required>
<option selected disabled>Select </option>
<option value="Y">Yes</option>
<option value="N">No</option>
</select>
回答by Debajyoti
In CSS:
在 CSS 中：
.btn.btn-default.dropdown-toggle.is-invalid {
border-color: #dc3545;
}
In HTML:
在 HTML 中：
<input type="hidden" class="form-control" name="idType" required />
<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>
In JavaScript: set the value of the input field on selecting the dropdown.
在 JavaScript 中：在选择下拉列表时设置输入字段的值。
回答by Mihiraj Madhusanka
<select class="form-control" required="required">
<option>A</option>
<option>A</option>
<option>A</option>
</select>
please set required = "required" in your selector
请在您的选择器中设置 required = "required"
