JQuery验证问题-返回False。 (jQuery步骤)

时间:2019-01-10 15:54:21

标签: jquery jquery-plugins jquery-steps

我找到了一个jQuery步骤验证脚本。当我运行应用程序时,下一步不会发生。我正在使用jQuery 3.3.1,jquery.steps,jquery-ui.min和jquery.validate。那么,我想念什么?

<body>
  <div class="page-content">
    <div class="wizard-v2-content">
      <div class="wizard-image">
      </div>
      <div class="wizard-form">
        <div class="wizard-header">
          <h3>Hello</h3>
        </div>
        <form id="form" class="form-register" method="post">
          <div id="form-total">
            <!-- SECTION 1 -->
            <h2>1</h2>
            <section>
              <div class="inner">
                <div class="form-row">
                  <div class="form-holder">
                    <select required class="form-control" name="note1" id="note1">
                      ...a few selects
                    </select>
                  </div>
                </div>
              </div>
            </section>
            <!-- SECTION 2 -->
            <h2>2</h2>
            <section>
              <div class="inner">
                <div class="form-row">
                  <div class="form-holder">
                    <select required class="form-control" name="note2" id="note2">
                      ...a few selects
                    </select>
                  </div>
                </div>
              </div>
            </section>
            <!-- SECTION 3 -->
            <h2>3</h2>
            <section>
              <div class="inner">
                <div class="form-row">
                  <div class="form-holder shadow-textarea">
                    <select name="classification[]" id="classification[]" class="mdb-select md-form" multiple>
                      ...a few selects
                    </select>
                    <input type="text" id="justificativa" name="justificativa" class="form-control" maxlength="250">
                  </div>
                </div>
              </div>
            </section>
          </div>
        </form>
      </div>
    </div>
  </div>
  <script src="js/jquery-3.3.1.min.js"></script>
  <script src="js/jquery.steps.js"></script>
  <script src="js/jquery-ui.min.js"></script>
  <script src="js/jquery.validate.min.js"></script>
  <script src="js/main.js"></script>
</body>
var form = $("#form-total");

form.validate({
  errorPlacement: function errorPlacement(error, element) {
    element.before(error);
  },
  rules: {
    "note1": {
      required: true
    }
  }
});

form.steps({
  headerTag: "h2",
  bodyTag: "section",
  transitionEffect: "fade",
  enableAllSteps: true,
  autoFocus: true,
  transitionEffectSpeed: 700,
  titleTemplate: '<span class="title">#title#</span>',
  labels: {
    previous: 'Back',
    next: 'Next',
    finish: 'Submit',
    current: ''
  },
  onStepChanging: function(event, currentIndex, newIndex) {
    form.validate().settings.ignore = ":disabled,:hidden";
    return form.valid();
  },
  onFinished: function(event, currentIndex) {
    $("#form").submit();
  }
});

验证在falseonStepChanging)中返回form.valid()。我无法更改步骤,为什么?还需要其他标签吗?

0 个答案:

没有答案