防止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提交

回答

相關問題