最近碰到一個問題:頁面使用了Ajax,非jQuery,用的是微軟的ScriptManager和UpdateProgress。如何在資料回傳過程中禁止使用者重複提交?即使用者點了提交按鈕後,按鈕不能用,等到資料回傳後,按鈕狀態自動變為可用!
到微軟的論壇上去問了,高手給出了答案。經測試,下面的方法可行!
前台頁面:
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel runat="server" ID="UpdatePanel1">
<ContentTemplate>
<asp:Button Text="提交" ID="btn_Go" runat="server" onclick="btn_Go_Click" />
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<img alt="" src="Images/Loading1.gif" style="width: 32px; height: 32px" />正在處理……
</ProgressTemplate>
</asp:UpdateProgress>
</form>
後台代碼:
protected void Page_Load(object sender, EventArgs e)
{
ScriptManager.RegisterOnSubmitStatement(Page, typeof(Page), "Go_disabled", "document.getElementById('btn_Go').disabled='disabled';");
ScriptManager.RegisterStartupScript(Page, typeof(Page), "Clear_disabled", "document.getElementById('btn_Go').disabled='';", true);
}
protected void btn_Go_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(3000);//類比任務
//for (long i = 1; i < 1000000000; i++) ;
btn_Go.Text = "execute complete";
}