簡體   English   中英

步驟向導和歐芹無法驗證

[英]Steps wizard and parsley not validating

我在wizard.js文件中的表單具有jQuery步驟功能

$("#wizard-validate").steps({
    headerTag: ".wizard-title",
    bodyTag: ".wizard-container",
    transitionEffect: "fade",
    onStepChanging: function (event, currentIndex, newIndex) {
        if (currentIndex > newIndex) {
            return true;
        }
        if (newIndex === 3 && Number($("#age-2").val()) < 18) {
            return false;
        }

        if ((currentIndex === 0)) {
            return $(this).parsley();
        }
    },
    onStepChanged: function (event, currentIndex, priorIndex) {
        if (currentIndex === 2 && Number($("#age-2").val()) >= 18) {
            $("#form-3").steps("next");
        }

        if (currentIndex === 2 && priorIndex === 3) {
            $("#form-3").steps("previous");
        }
    },
    onFinishing: function (event, currentIndex, newIndex) {
        return $(this).parsley().validate();
    },
    onFinished: function () {
        alert("submitted!");
    }
});

並且它不是驗證表單..只是轉到下一步。

我的形式是:

<form class="form-horizontal form-bordered" action="" data-parsley-validate id="wizard-validate">           
    <!-- Wizard Container 1 -->
    <span class="response"></span>
    <div class="wizard-title">Details</div>
    <div class="wizard-container">
        <input type="text" name="title" required value="" class="form-control"> 
        <input type="text" name="location" required class="form-control" value="" >
        <input type="text" class="form-control" required id="datepicker1" name="startdate"  value="" />
        <input type="text" class="form-control" required id="time-picker" name="starttime"  value="" />
        <input type="text" class="form-control" required id="datepicker2" name="enddate"  value=""  />
        <input type="text" class="form-control" required id="time-picker2" name="endtime"  value="" />
    </div>
    <!--/ Wizard Container 1 -->

    <!-- Wizard Container 2 -->
    <div class="wizard-title">Details 2</div>
    <div class="wizard-container"></div>
    <!--/ Wizard Container 2 -->
</form>

並沒有任何反應..只是進入下一步,僅此而已。.已經嘗試了完整的屬性,例如: data-parsley-requireddata-parsley-required="true"

我按順序包含的js文件為:1. jquery.js 2. parsley.js 3. jquery.steps.js 4. Wizard.js

我找到了解決方案:

向導功能和parsley檢查在哪里return $(this).parsley(); 需要更改為return $(this).parsley().validate(); 並完美地工作!

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM