检测实际的表单提交并显示加载器

Posted 2023-03-05

【中文标题】检测实际的表单提交并显示加载器

【英文标题】：Detect actual form submit and show loader

【发布时间】：2013-02-19 17:47:47

【问题描述】：

我有一个启用了 jQuery-Validation-Engine 的表单，我想在表单实际提交时显示一个加载器，即当它没有错误时。如果我使用以下代码，即使表单有错误也会被调用。

$("#my-form").submit(function()
  showLoaderGIF here;
);

我想知道如何检测实际的表单提交，而不仅仅是点击提交按钮？有什么方法可以使用 jQuery-Validation-Engine 的 'onSuccess' 回调？

提前致谢

【问题讨论】：

How to do a Jquery Callback after form submit? 的可能重复项

【参考方案1】：

我会放弃$("#my-form").submit，编写几个函数来显示/隐藏我的加载程序图像，并使用以下钩子：

jQuery("#my-form").validationEngine(
  ...
  onBeforeAjaxFormValidation: showLoader,
  onAjaxFormComplete: hideLoader,
  ...
);

编辑

好的，所以要显示表单是否有效但不允许提交，您可以使用onValidationComplete 选项：

jQuery("#my-form").validationEngine('attach', 
  onValidationComplete: function(form, status)
    if(status)  showLoader(); 
    
);

【讨论】：

在我的情况下，表单尚未提交到服务器。如果（表单没有错误&&提交按钮被点击）我想显示加载器

【参考方案2】：

最后，我能够使用以下代码实现这一点

$("my-form").validationEngine('attach',     
  onValidationComplete: function(form,status)
    if(status == true)
      showLoader;
      return true;
    
  
);