使用Jquery進行表單向導驗證

Question

我正在使用Jquery實現表單向導驗證。 當我提交表單或onkeyup事件時，它可以工作。 但是我正在嘗試使用表單向導。 在單擊下一步按鈕時，更改代碼后不會驗證任何內容。 在單擊下一步按鈕時，在更改代碼之前會出現警報消息。 我在Jquery中沒有那么多知識。 這里有一些代碼。

   onNext: function(tab, navigation, index) 
        {
            if(index==1)
            {
                if(!wiz.find('#inputname').val()) {
                    alert('You must enter the username');
                    wiz.find('#inputname').focus();
                    return false;
                }
            }
        }, 
        ....................


        $(function()
        {
      // validate form on keyup and submit
      $("#validateSubmitForm").validate({
      rules: {
        firstname: "required",
        lastname: "required",
        username: {
            required: true,
            minlength: 2
        },
        ......................

為了執行表單向導驗證，我將上面的代碼更改為

        onNext: function(tab, navigation, index) 
        {
            if(index==1)
            {
                  myfun();
            }
        ................


      function myfun()
      {
      // validate form on keyup and submit
       $("#validateSubmitForm").validate({
       rules: {
        firstname: "required",
        lastname: "required",
        username: {
            required: true,
            minlength: 2
        },
        ..................

在JSP中：

    <div class="tab-pane active" id="tab1">
    <form class="form-horizontal" style="margin-bottom: 0;" id="validateSubmitForm" method="get" autocomplete="off">
     <div class="control-group">
     <label class="control-label" for="firstname">First name</label>
     <div class="controls"><s:textfield class="span12" id="firstname" name="firstname"/></div>
     </div>
            .........................
     <div class="form-actions">
     <button type="submit" class="btn btn-icon btn-primary glyphicons circle_ok"><i></i>Save</button>
     <button type="button" class="btn btn-icon btn-default glyphicons circle_remove"><i></i>Cancel</button>
     </div>
     </form></div>//tab div

但這沒有用。 如何使用表單向導執行相同的驗證，就像我對onkeyup和onkeyup所做的那樣。

Answer 1

現在，更改為此功能后即可正常工作。

       onNext: function(tab, navigation, index) 
        {
               if ($('#validateSubmitForm').validate().form()) 
                {
                    return true;
                } 
                else 
                {
                    return false;// prevent moving on if the form is invalid
                }
              ..............



       $(function()
       {
       // validate form on keyup and submit
        $("#validateSubmitForm").validate({
        rules: {
        firstname: "required",
        lastname: "required",
        username: {
            required: true,
            minlength: 2
        },
        ................