我在一個 ASP.NET MVC 應用程式中作業,我想在表單的 OnSubmit 事件期間禁用一個按鈕,只是為了防止用戶雙擊。所有 JQuery 部分都作業正常,但我不明白為什么,當我禁用提交按鈕時,它總是呼叫我的控制器的默認操作。
這是cshtml代碼:
@using(Html.BeginForm()){
<input type="submit" value="Submit"/>
}
<script>
$(function(){
$("form").submit(e=>{
$('input[type="submit"]').prop("disable",true)
})
})
</script>
JQuery 部分起作用并使按鈕被禁用。
我的控制器:
public class MyController:Controller{
public ActionResult MyController(ExampleModel model){
return View(model);
}
[HttpPost,ActionName("MyController")]
public ActionResult FormSubmmit(ExampleModel model){
//Do some checks
return View(model);
}
}
情況是,如果我禁用按鈕,表單總是呼叫操作“MyController”而不是操作 FormSubmit(我想呼叫它)。有人知道為什么會是這個“錯誤”的原因嗎?
uj5u.com熱心網友回復:
嘗試這個
@Html.BeginForm("FormSubmit", "My", FormMethod.Post) {
<input type="submit" value="Submit"/>
}
并從動作中洗掉 [HttpPost,ActionName("MyController")],這是一個非常奇怪的屬性
uj5u.com熱心網友回復:
這是禁用按鈕以防止任何“雙擊”的快速可靠的方法
<form ... onsubmit="myButton.disabled = true; return true;">
...
<input type="submit" name="myButton" value="Submit">
</form>
你可以在這里看到源
提交時執行此操作的另一種方法是執行疊加然后重定向功能(可選,我使用它來停止疊加并基本上通知用戶該功能已完成)
HTML:
<input type="submit" onclick="return FunctionOverlay(this);" />
<script>
function FunctionOverlay(btnElement)
{
showOverlay(btnElement);
$('#myForm').submit();
}
</script>
JS:
function showOverlay(buttonElement) {
$(buttonElement.parentNode).css('position', 'relative');
$bgColor = $(buttonElement).attr('data-overlay-color');
if ($bgColor === undefined) {
$bgColor = '#fff';
}
$(buttonElement.parentNode).append('<div style="background-color:' $bgColor ';"><img src="images/blahblah.gif" /></div>'); //.css('background-color', $bgColor)
}
您可以使用它來創建自己的疊加 GIF,然后在您呼叫 Method 的控制器中,您可以用它來結束它
return View("ButtonClicked");
并在您的主頁中創建一個 cshtml ButtonClicked.cshtml
只需創建一個登錄頁面,您可以在其中插入一些文本,例如:
<div class="row">
<div class="col">
<p> Thank you for clicking??</p>
</div>
</div>
另一種選擇是使用超時進行疊加
$('form').submit(function () {
var button = $('#button');
var oldValue = button.value;
var isDisabled = true;
button.attr('disabled', isDisabled);
setTimeout(function () {
button.value = oldValue;
button.attr('disabled', !isDisabled);
}, 3000)
});
uj5u.com熱心網友回復:
第一個,謝謝解答!而我只是找到了解決方案。
代碼的問題是,如果我使用 disabled ,它會在表單提交事件期間更改請求元資料,因此我無法禁用按鈕。
我找到了這個解決方案,它只是從按鈕上取消指標事件,然后它可以防止雙重提交問題。
$('input[type="submit"]').css("pointer-events","none")
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/336757.html
標籤:C# 查询 asp.net asp.net-mvc 剃刀
上一篇:模態內的Asp驗證
