Tôi có một ứng dụng asp.net mà tôi muốn vô hiệu hóa các nút ngay khi chúng được nhấp để ngăn chặn nhiều lần gửi. Tôi muốn sử dụng jquery cho điều này vì trang web đã được tự do sử dụng nó anyway.Vô hiệu hóa các nút trên bài đăng trở lại bằng cách sử dụng jquery trong ứng dụng .net
Những gì tôi đã cố gắng là:
$(document).ready(function() {
$("#aspnetForm").submit(function() {
$('input[type=submit]', $(this)).attr("disabled", "disabled");
})
});
trên sẽ vô hiệu hóa các nút, và trang nộp, nhưng nút asp.net trên handler nhấp chuột không bao giờ được gọi. Chỉ cần xóa các nút ở trên và các nút hoạt động như bình thường.
Có cách nào tốt hơn không? Hay đúng hơn, tôi đang làm gì sai?
CẬP NHẬT Được rồi, cuối cùng tôi đã có một chút thời gian để đặt một trang rất đơn giản với nhau.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SubTest.aspx.cs" Inherits="MyTesting.SubTest" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$("#form1").submit(function() {
$('input[type=submit]', $(this)).attr("disabled", "disabled");
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" />
<asp:Button ID="Button2" runat="server" onclick="Button2_Click" Text="Button 2" />
</div>
</form>
</body>
</html>
Các mã sau trông giống như:
using System;
namespace MyTesting {
public partial class SubTest : System.Web.UI.Page {
protected void Page_Load(object sender, EventArgs e) {
if (IsPostBack) {
// this will execute when any button is pressed
Response.Write("postback");
}
}
protected void Button1_Click(object sender, EventArgs e) {
// never executes
System.Threading.Thread.Sleep(1000);
Response.Write("Button 1 clicked<br />");
} // method::Button1_Click
protected void Button2_Click(object sender, EventArgs e) {
// never executes
System.Threading.Thread.Sleep(1000);
Response.Write("Button 2 clicked<br />");
} // method::Button2_Click
}
}
Khi bạn bấm vào một nút nó rõ ràng là vô hiệu hóa các nút, nhưng không ai trong số các nhấp chuột vào nút đang chạy.
HTML rendered
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
</title>
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$("#form1").submit(function() {
$('input[type=submit]', $(this)).attr("disabled", "disabled");
});
});
</script>
</head>
<body>
<form name="form1" method="post" action="SubTest.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTcxODU4OTc0MWRkParC5rVFUblFs8AkhNMEtFAWlU4=" />
</div>
<div>
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAwKB57WhCAKM54rGBgK7q7GGCC6LlWKFoij9FIBVuI0HOVju/fTy" />
</div>
<div>
<input type="submit" name="Button1" value="Button" id="Button1" />
<input type="submit" name="Button2" value="Button 2" id="Button2" />
</div>
</form>
</body>
</html>
Rất thú vị gotchya –
Tôi nghĩ rằng tôi biết chính xác những gì đang xảy ra bây giờ. Bởi vì các thuộc tính nút bị vô hiệu hóa được thiết lập, các động cơ asp.net nói "oh, nút bị vô hiệu hóa, không chạy nó đăng lại mã!" Tuy nhiên, vì gửi được gửi đi, nó tiếp tục và thực hiện một bài đăng thường xuyên trở lại ... grr – NotMe