使用 Bootstrap 验证时如何动态禁用表单提交按钮

Question

我有一个使用 Bootstrap Validator http://1000hz.github.io/bootstrap-validator/ 验证的表单。

您一开始看不到表单（显示：无）。当您进入填写表单的步骤时，虽然表单无效，但“提交”按钮已启用。 但是，如果我立即显示表单，则提交按钮将被禁用，直到表单有效，正如我希望的那样。有谁知道为什么会发生这种情况以及如何让它发挥作用？

<div id="step0">
  Some code here that is visible in the first step
  <div class="row">
    <button type="button" class="btn btn-primary" onclick="step1();">Go to step 1</button>
  </div>
</div>

<div id="step1" style="display: none;">
  <form id="forma-klijenta" data-toggle="validator" method="post" action="test.php">
    <div class="row">
      <div class="col-md-8 col-sm-12 form-right">
        <h3> Lični podaci </h3>
        <div class="row">
          <div class="col-xs-12 form-group col-sm-6">
            <input autocomplete="off" class="form-control" id="ime" data-minlength="2" name="ime" placeholder="Ime" required type="text" value=""
            pattern="^[A-ZŠĐČĆŽa-zšđčćž]([-' ]?[A-ZŠĐČĆŽa-zšđčćž])+$"data-error="Ime je obavezno. Dozvoljeni specijalni karakteri su - i '." />
            <div class="help-block with-errors"></div>
          </div>
        </div>

      </div>
    </div> 
    <div class="row form-group">
      <button type="submit" class="btn btn-primary">Submit</button>
    </div>     

  </form>
<!--      Kraj forme za unos podataka -->
</div>

Answer 1

这就是我解决这个问题的方法：

• 删除了 style="display: none;"

• 添加了 jQuery

  $(document).ready(function(){
    $("#step1").hide();
  });