防止Yii 2.0.10中的多次点击和ActiveForm提交

我经常使用ActiveForms，并且发现它很方便，因为它包括客户端验证脚本yii.js和yii.activeForm.js。它通常自行处理模型规则和基本验证。防止Yii 2.0.10中的多次点击和ActiveForm提交

直到Yii的2.0.9：
我们可以使用下面的脚本，以防止多个表单提交由于快速按钮点击：

$('form').submit(function(){ 
    $(this).find('button[type!="button"],input[type="submit"]').attr("disabled",true); 
    setTimeout(function(){ 
     $('form .has-error').each(function(index, element) { 
      $(this).parents("form:first").find(":submit").removeAttr("disabled"); 
     }); 
    },1000); 
});

但是，
当前的Yii 2.0.10发布带来一些更改并且在脚本之上失败。现在，如果上面的代码执行，它将不会提交表单。
它也已被讨论过here，并被确定为bug。
因为，yii.js有两个变化：

错误＃10358：在yii.js AJAX前置修正竞态条件（silverfire）
ENH＃12580：请yii.js遵守严格的和非严格的javascript模式，以允许与外部代码（mikehaertl）

和，级联yii.activeForm.js有四个变化：

错误＃106 81：beforeValidate事件调用yii.activeForm.js（silverfire）
ENH＃12376的已还原修正：添加了参数，以验证yii.activeForm.js（）方法，以便能够迫使验证（DrDeath72）
ENH＃ 12499：当启用了AJAX验证，yii.activeForm.js将运行它有力的表单提交，以显示所有可能的错误（silverfire）
ENH＃12744：新增afterInit事件yii.activeForm.js（werew01f）

它们可以用v2.0.9中的oder js文件替换吗？

将替换js文件导致故障和意外的行为？

有没有更好的解决方案来防止多次提交？

来源

2017-01-13 Kiran Shakya

我试图用你的代码，警予v2.0.10，通过registerJs在我的布局文件添加它，唯一的差异我使用'yii \ bootstrap \ ActiveForm'而不是'yii \ widgets \ ActiveForm'可能是它为我工作的原因吗？ – Ripper

@Ripper是否正常工作？点击后，你看到按钮禁用？我也使用registerJs。至于'yii \ bootstrap \ ActiveForm'和'yii \ widgets \ ActiveForm'，前者是后者的增强版本，所以在技术上应该没有多大区别。 –

是的，我看到它在点击后立即禁用，表单正常提交，就像我之前说过的那样。 – Ripper

看起来问题已经被处理了。
那些通过作曲家安装了新鲜的Yii 2.0.10的人不会遇到这个问题;而那些从“从存档文件安装”部分下载存档文件的用户可能仍然存在此问题，因为他们可能没有更新存档文件。

如果您遇到此特定问题，那么您只需从github source替换特定文件framework/assets/yii.activeForm.js即可。在本地复制的情况下，该文件可以位于vendor\yiisoft\yii2\assets\yii.activeForm.js。

来源

2017-01-15 11:34:10

我建议你使用uiBlocking来防止多次点击或输入。这是complte指南如何阻止用户界面，而有一些任务正在进行中。 http://malsup.com/jquery/block/

来源

2017-01-16 07:46:42 Dani

uiBlocking的确是一个非常有用的jQuery插件。谢谢你在这里提到它。 –

最近有一些错误，我的表单，我们不提交，并保持禁用按钮，所以我改变了这一点。这里大多张贴对我将来的参考，所以我可以找到它快：d

<?php $this->registerJs(" 
    $(function() { 
     $('body').on('submit', 'form', function() { 
      $(this).find('button[type!=\"button\"],input[type=\"submit\"]').attr('disabled',true); 
      setTimeout(function(){ 
       $(this).find('.has-error').each(function(index, element) { 
        $(this).parents('form:first').find(':submit').removeAttr('disabled'); 
       }); 
      },1000); 
     }); 
    }); 
", View::POS_END, 'prevent-double-form-submit'); ?>

来源

2017-01-20 21:48:44 Ripper

就像一个魅力

我实现并测试了以下扩展名：

https://github.com/Faryshta/yii2-disable-submit-buttons

作曲家要求

"faryshta/yii2-disable-submit-buttons": "*"

注册资产Globaly

class AppAsset extends yii\web\AssetBundle 
{ 
    public $depends = [ 
     'faryshta\\assets\\ActiveFormDisableSubmitButtonsAsset', 
     // other dependencies 
    ]; 
}

使用

$form = ActiveForm::begin([ 
    'options' => ['class' => 'disable-submit-buttons'], 
    // other configurations 
]); 

    // inputs 

    Html::submitButton('Submit', [ 
     // optional, will show the value of `data-disabled-text` attribute 
     // while handling the validation and submit 
     'data' => ['disabled-text' => 'Please Wait'] 
    ]) 

$form->end();

来源

2017-09-21 20:03:06

在对堆栈溢出和yii2论坛上的解决方案进行了审查之后，本文将其列为我的固定列表，因为您可以在提交应用后选择要使用的表单。 –

防止Yii 2.0.10中的多次点击和ActiveForm提交

回答

相关问题