bootstrap-validate 用于 bootstrap 4 的选择输入答案

【问题标题】：bootstrap-validate for select inputs for bootstrap 4bootstrap-validate 用于 bootstrap 4 的选择输入
【发布时间】：2019-07-23 18:49:01
【问题描述】：

我使用 bootstrap-validate 来进行 bootstrap 4 位于此处：

https://bootstrap-validate.js.org/installation.html

我正试图让它验证我这样的选择输入：

    <div class="form-group">
        <label for="numberOfBedrooms">Number of Bedrooms<span>*</span></label>
        <select class="form-control" name="numberOfBedrooms" id="numberOfBedrooms" required>
            <option value="">Please select</option>
            <option value="1">1 Bedroom</option>
            <option value="2">2 Bedrooms</option>
            <option value="3">3 Bedrooms</option>
            <option value="4">4 Bedrooms</option>
            <option value="5">5+ Bedrooms</option>
        </select>
    </div>

我的脚本是这样做的：

bootstrapValidate('#numberOfBedrooms', 'required:Please select one option');

但它似乎没有验证。没有为选择输入字段或表单组分配类。有谁知道为什么这不起作用？

【问题讨论】：

标签： bootstrap-4 bootstrap-validate

【解决方案1】：

我会检查您是否正确地从图书馆开始。当我将您的代码引入JSFiddle 并将此代码添加到其中时：

bootstrapValidate('#numberOfBedrooms', 'required:Please select one option', function (isValid) {
   if (isValid) {
       alert('Element is valid');
   } else {
       alert('Element is invalid');
   }
});

当我选择了有效/无效的输入时，它会正确地提醒我。不过需要注意的是，在查看控制台时会出现如下错误

Assertion failed: Input argument is not an HTMLInputElement

因此它可能没有将选择视为正确的输入元素并正确读取该选择的长度。另外，您在 javascript 中的哪个位置调用了 validate 方法？我假设您有一个提交按钮并在该按钮的 onclick 中？

【讨论】：