asp.net implementation code that is disabled after the button is clicked
- 2020-05-10 18:00:55
- OfStack
1. Script the button to disable it after it is clicked:
The sad truth is that this doesn't work: the page doesn't reply at all. So we had to find other ways.
So that's what we want to do. Finally, one more way is introduced: 3. Using setTimeout implementation
In this way we have implemented the requirements without introducing auxiliary controls.
Note: to better observe the test effect, Sleep can be used in the Click time processing function of the button for a few seconds.
Of course, jquery's unbind and bind functions can be used to remove or add operations to its click events.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="DisableButton.WebForm1" %>
<!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 type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript">
function enableButton(flag) {
$("#btnTest").attr("disabled", flag? "" : "disabled");
}
$(document).ready(
function () {
$("#btnTest").click(
function () {
enableButton( false );// Click and disable
}
);
}
);
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Button ID="btnTest" Text=" Click and disable " runat="server" OnClick="Test" />
</div>
</form>
</body>
</html>
The sad truth is that this doesn't work: the page doesn't reply at all. So we had to find other ways.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="DisableButton.WebForm1" %>
<!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 type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript">
function enableButton(flag) {
$("#btnTest").attr("disabled", flag? "" : "disabled");
}
$(document).ready(
function () {
$("#btnTest").click(
function () {
enableButton(false);
$("#btnTest2").click();// Disable itself and call the button that actually triggers the postback click The event
}
);
}
);
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="button" value=" Click and disable " id="btnTest" />
<asp:Button ID="btnTest2" Text=" Click and disable " runat="server" OnClick="Test" style="display:none"/>
</div>
</form>
</body>
</html>
So that's what we want to do. Finally, one more way is introduced: 3. Using setTimeout implementation
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="DisableButton.WebForm1" %>
<!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 type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript">
function enableButton(flag) {
$("#btnTest").attr("disabled", flag? "" : "disabled");
}
$(document).ready(
function () {
$("#btnTest").click(
function () {
setTimeout(function () {
enableButton(false);
},
50);
}
);
}
);
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Button ID="btnTest" Text=" Click and disable " runat="server" OnClick="Test"/>
</div>
</form>
</body>
</html>
In this way we have implemented the requirements without introducing auxiliary controls.
Note: to better observe the test effect, Sleep can be used in the Click time processing function of the button for a few seconds.
Of course, jquery's unbind and bind functions can be used to remove or add operations to its click events.