Question

在该问题之前已经提出过这个问题： Prevent multiple clicks and ActiveForm submission in Yii 2.0.10

症状

我有一个id等于surasGo的有效表单。我使用Jquery附加submit事件来在提交之前处理某些任务。我注意到事件函数中的任何alert函数都会生成两次。我查看了页面HTML源代码，我找到了以下代码段：

...
jQuery('#surasGo').yiiActiveForm([], []);
});</script></body>

在上一个片段之前有链接的javascript文件包含我的代码：

$('#surasGo').submit(function(e){
    e.preventDefault();
    suraId = $('#surasId').val()*1;
    verseId = $('#versesId').val()*1;   
    if (!isNaN(verseId*1) && verseId !== 0){
      window.location = '/verses/view/'+verseId;
    }
    else if (!isNaN(suraId) && suraId !== 0){
      window.location = '/view/'+suraId;
    }
    else{
      alert(tError+"\n"+tQAccessError);// this alerted twice for example
    }
    return false;
  });

我尝试了什么

我意识到由于活动表单客户端验证，第一个代码段jQuery('#surasGo').yiiActiveForm([], []);可能负责提交事件的双重调用，因此我将'enableClientValidation'=>false属性添加到活动表单中：

 <?php $form = ActiveForm::begin(['id' => 'surasGo','enableClientValidation'=>false, 'action'...

然而，表格似乎仍然要经历两次提交活动！造成这种奇怪行为的原因是什么以及如何解决？

Answer 1

我认为您还需要停止执行任何下游事件处理程序链。除了event.stopImmediatePropagation()

之外，还可以通过调用event.preventDefault().来完成此操作

试试这样：

$('#surasGo').submit(function(e){
    e.preventDefault();
    e.stopImmediatePropagation(); // this is required in some cases
    suraId = $('#surasId').val()*1;
    verseId = $('#versesId').val()*1;   
    if (!isNaN(verseId*1) && verseId !== 0){
      window.location = '/verses/view/'+verseId;
    }
    else if (!isNaN(suraId) && suraId !== 0){
      window.location = '/view/'+suraId;
    }
    else{
      alert(tError+"\n"+tQAccessError);// this alerted twice for example
    }
    return false;
  });

Answer 2

像魅力一样工作

我实施并测试了以下扩展程序：

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

作曲家需要

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

注册Asset 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();

Answer 3

为'validateOnSubmit' => false设置ActiveForm为我工作：

$form = ActiveForm::begin(['id' => 'my-form-id', 'validateOnSubmit' => false]);

Answer 4

尝试在“ beforeValidate”方法中返回布尔值false，例如：

$(document).on("beforeValidate", "#form_id", function (event, messages) {
      //console.log('beforeValidate');
      return false;
    });

Yii2活动表单提交事件被调用两次

4 个答案: