2017-05-30 38 views
0

我只是編程的新手,所以請溫和。如何在asp.net mvc 5查看按鈕中使用jquery插件點擊

我正在使用Visual Studio Community 2015版。 我的項目使用標準的asp.net MVC 5解決方案模板。 我有一個包含創建按鈕的Visual Studio腳手架輸入窗體。

我遇到了一個問題,試圖阻止由於雙擊而導致多次提交表單。

幾年前,我一直在嘗試實現一個解決方案發布在stackoverflow上,但經過兩天的嘗試,我沒有更進一步的前進。

的解決方案涉及使用下面的jQuery插件(我必須承認,我不知道很多關於Java呢!)

這個我想用jQuery插件代碼的下方,來自該原崗位

Prevent double submission of forms in jQuery

jQuery.fn.preventDoubleSubmission = function() { 
    $('input[type="submit"]').data('loading-text', 'Loading...'); 

    $(this).on('submit',function(e){ 
    var $form = $(this); 

    $('input[type="submit"]', $form).button('loading'); 

    if ($form.data('submitted') === true) { 
     // Previously submitted - don't submit again 
     e.preventDefault(); 
    } else { 
     // Mark it so that the next submit can be ignored 
     $form.data('submitted', true); 
     $form.setFormTimeout(); 
    } 
    }); 

    // Keep chainability 
    return this; 
}; 

jQuery.fn.setFormTimeout = function() { 
    var $form = $(this); 
    setTimeout(function() { 
    $('input[type="submit"]', $form).button('reset'); 
    alert('Form failed to submit within 30 seconds'); 
    }, 30000); 
}; 

*/

我遇到的問題是如何在我的凸出部署jQuery插件然後當有人點擊創建按鈕時如何調用它。

我已經嘗試將插件直接放在頁面視圖中,也作爲腳本文件夾中的JavaScript文件,但仍似乎不能調用函數來防止雙重提交。

我想通過按鈕的onclick屬性調用該函數,但不能讓它運行。有沒有人有一個以前的解決方案的記憶,以及如何在ASP.NET MVC 5 cshtml視圖按鈕點擊實現它?

(我在哪裏可以把插件代碼,如何調用它從創建按鈕)

非常感謝

回答

0

使用此代碼在jQuery的一邊是防止雙擊

$(document).on('submit', 'form', function() { 
     var button = $(this).find('input[type="submit"]'); 
     setTimeout(function() { 
      button.attr('disabled', 'disabled'); 
     }, 0); 
    }); 

如果無效發佈時間您的表格和驗證後

//disabled Multiple Click Event on form 
    $(document).on('invalid-form.validate', 'form', function() { 
     var button = $(this).find('input[type="submit"]'); 
     setTimeout(function() { 
      button.removeAttr('disabled'); 
     }, 1); 
    });