Question

我正在尝试使用Bootstrap 4的新验证功能，但提交验证错误时无法显示弹出窗口。

我的表单是：

<form id="runModelForm" class="needs-validation" novalidate>
<div class="form-group row">
    <label for="errCurrent" class="col-sm-3 col-form-label">My label</label>
    <div class="col-sm-2">
        <input class="form-control form-control-sm run-model-numeric" id="errCurrent" value="0.11" required />
        <div class="invalid-tooltip">Required</div>
    </div>
    <div class="col-sm-7">
        <small class="form-text text-muted col-sm-12">Some text here</small>
    </div>
</div>
</form>

在我使用脚本标签引用的javascript文件中，我拥有：

$(document).ready(function () {

  $("#runButton").click(function () {
    var form = $("#runModelForm");
    if (form[0].checkValidity() === false) {

        event.preventDefault();
        event.stopPropagation();
    }

    form.addClass('was-validated');
  });

如果有问题，我正在使用Bootstrap 4.1.3。

Answer 1

现在唯一正在执行的验证是该字段是否为空。如果您将输入空白，则会显示“必需”弹出框。

添加类was-validated不会触发bootstrap 4验证

1 个答案: