表单验证如何排除输入字段?

时间:2019-07-04 11:21:36

标签: forms validation bootstrap-4

我正在遵循bootstrap 4表单验证https://getbootstrap.com/docs/4.0/components/forms/#validation

但是我喜欢从验证中排除输入字段。在示例中

  <div class="col-md-4 mb-3">
  <label for="validationCustomUsername">Username</label>
  <div class="input-group">
    <div class="input-group-prepend">
      <span class="input-group-text" id="inputGroupPrepend">@</span>
    </div>
    <input type="text" class="form-control" id="validationCustomUsername" placeholder="Username" aria-describedby="inputGroupPrepend" required>

好!你有这个!                    请选择一个用户名。                

我认为,只需将所需属性设置为false即可解决问题,但没有效果

<input type="text" class="form-control" id="validationCustomUsername" placeholder="Username" aria-describedby="inputGroupPrepend" required="false">

我点击“提交”按钮后,用户名字段就会显示绿色边框。

我还添加了此.js,我应该在此处添加排除的输入字段吗?

 (function() {
        'use strict';
                window.addEventListener('load', function() {
                // Fetch all the forms we want to apply custom Bootstrap validation styles to
                var forms = document.getElementsByClassName('needs-validation');
                        // Loop over them and prevent submission
                        var validation = Array.prototype.filter.call(forms, function(form) {
                        form.addEventListener('submit', function(event) {
                            if (form.checkValidity() === false) {
                            event.preventDefault();
                                    event.stopPropagation();
                            }
                        form.classList.add('was-validated');
                        }, false);
                        });
                }, false);
        })();

选择菜单上的验证似乎也不起作用:

    <select class="form-control" name="type" id="add_type" required>
         <option selected disabled>Select</option>
         <option value="1">Option 1</option>
          <option value="2">Option 2</option>
    </select>

0 个答案:

没有答案