引导表单向导 - 防止在提交 ajax 响应的每个页面表单出现错误时滚动到下一步

Bootstrap Formwizard - Prevent to scroll to next step if each page form submitting ajax response gets error

本文关键字：表单 面表 下一步 滚动 错误 向导 响应 ajax 提交      更新时间：2023-09-26

我正在使用Twitter引导表单向导在每个页面上提交数据并进行验证。现在我想防止，如果 ajax 响应在提交数据时出错，请滚动到下一步。下面是我的代码，

'onNext': function(tab,navigation,index){
    //scrollTo('#wizard',-100);
    if(index == 1){
        var $valid = $('#register_form').valid();
        if(!$valid){
            $validator.focusInvalid();
            return false;
        }
        else
        {
            var options = $('form[name=register_form]').find('input, textarea, select').filter('.fw1').serialize();
            var data = options + '&step=1';
            $.ajax({
                type: 'POST',
                url: 'employeeEntryProcess.php',
                data: data,
                success: function(data){
                    this.show(2);
                },
                error: function(){
                    return false;
                }
            });
        }
    }
},

谢谢

它在更改后工作。感谢大家的帮助。

  'onNext': function(tab,navigation,index){
        if(index == 1){
          var $valid = $('#register_form').valid();
          if(!$valid){
            $validator.focusInvalid();
            return false;
          }
          else
          {
            var options = $('form[name=register_form]').find('input, textarea, select').filter('.fw1').serialize();
            var data = options + '&step=1';
            $.ajax({
              type: 'POST',
              url: 'employeeEntryProcess.php',
              data: data,
              success: function(response){
                 $('#wizard').bootstrapWizard('show',1);
              },
              error: function(){
                 alert('Error');
             }
          });
       }
   }
   return false;
},
执行此操作的唯一

方法是始终return false，以便它不会自动滚动到下一步，然后在 AJAX 请求的success函数中手动滚动到下一步（以便仅在成功时继续）。您可能希望在 AJAX 请求期间放置动画，否则看起来什么都没有发生。

相关文章：