[英]Disable button after submit
我試圖在用戶提交付款表單時禁用按鈕,並且發布表單的代碼在firefox中導致雙重帖子。 刪除代碼時不會發生此問題,並且除了firefox之外的任何瀏覽器中都不會發生此問題。
知道怎么防止這里的雙重帖子?
System.Text.StringBuilder sb = new StringBuilder();
sb.Append("if (typeof(Page_ClientValidate) == 'function') { ");
sb.Append("if (Page_ClientValidate() == false) { return false; }} ");
sb.Append("this.value = 'Please wait...';");
sb.Append("this.disabled = true;");
sb.Append(Page.GetPostBackEventReference(btnSubmit ));
sb.Append(";");
btnSubmit.Attributes.Add("onclick", sb.ToString());
這是導致問題的sb.Append(Page.GetPostBackEventReference(btnSubmit))行
謝謝
編輯:這是按鈕的c#:
<asp:Button ID="cmdSubmit" runat="server" Text="Submit" />
這是html
此代碼發布兩次(並禁用提交按鈕並驗證輸入):
<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" onclick="if (typeof(Page_ClientValidate) == 'function') { if (Page_ClientValidate() == false) { return false; }} this.value = 'Please wait...';this.disabled = true;document.getElementById('ctl00_MainContent_cmdBack').disabled = true;__doPostBack('ctl00$MainContent$cmdSubmit','');" id="ctl00_MainContent_cmdSubmit" />
此代碼發布兩次(但不禁用提交按鈕):
<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" onclick="__doPostBack('ctl00$MainContent$cmdSubmit','');" id="ctl00_MainContent_cmdSubmit" />
此代碼發布一次(但不驗證用戶輸入並且不禁用提交按鈕):
<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" id="ctl00_MainContent_cmdSubmit" />
此代碼發布一次(但不禁用提交按鈕):
<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$MainContent$cmdSubmit", "", true, "", "", false, false))" id="ctl00_MainContent_cmdSubmit" />
此代碼根本不發布:
<input type="submit" name="ctl00$MainContent$cmdSubmit" value="Submit" onclick="this.disabled = true;WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("ctl00$MainContent$cmdSubmit", "", true, "", "", false, false))" id="ctl00_MainContent_cmdSubmit" />
顯然,這是導致問題的提交按鈕的禁用。 您有什么想法我們如何禁用提交以避免多次點擊?
據推測, btnSubmit
已經連接了服務器端事件。 如果是這樣,則不需要調用Page.GetPostBackEventReference
。 只需刪除該行即可獲得所需的行為。
更新:您提到在C#代碼中附加事件處理程序,但您沒有提到您在何處執行此操作。 我猜它在Page_Load
處理程序中。 如果是這種情況,它將無法正常工作,因為在此時掛鈎按鈕單擊事件處理程序為時已晚。 讓我們試試吧。
首先,將JS放入其自己的函數而不是在C#代碼隱藏中構建它會更清晰。 我建議你把它放到一個腳本塊中(或者更好的是,它是自己的.js文件。)
function disableOnSubmit(target)
{
if (typeof(Page_ClientValidate) == 'function') {
if (Page_ClientValidate() == false) { return false; }
}
target.value = 'Please wait...';
target.disabled = true;
return true;
}
對於你的ASPX按鈕,試試這個:
<asp:Button ID="cmdSubmit" runat="server" Text="Submit" onclick="btnSumbit_Click" OnClientClick="return disableOnSubmit(this);" />
答案是添加一個返回false; 在你的最后一行之后;
例如
sbValid.Append(this.Page.ClientScript.GetPostBackEventReference(button, ""));
sbValid.Append(";");
一定是
sbValid.Append(this.Page.ClientScript.GetPostBackEventReference(button, ""));
sbValid.Append(";return false;");
這絕對適合我。
private void checkButtonDoubleClick(Button button)
{
System.Text.StringBuilder sbValid = new System.Text.StringBuilder();
sbValid.Append("if (typeof(Page_ClientValidate) == 'function') { ");
sbValid.Append("if (Page_ClientValidate() == false) { return false; }} ");
sbValid.Append("this.value = 'Please wait...';");
sbValid.Append("this.disabled = true;");
sbValid.Append(this.Page.ClientScript.GetPostBackEventReference(button, ""));
sbValid.Append(";return false;");
button.Attributes.Add("onclick", sbValid.ToString());
}
試試下面的代碼
<asp:Button ID="cmdSubmit" runat="server" Text="Submit" onclick="btnSumbit_Click" OnClientClick="this.style.display = 'none';"/>
拿出那一行,表單已經提交,因為它是一個提交按鈕,而不是常規按鈕類型,看看ASP.NET如何呈現元素。
頁面驗證器在form.onsubmit回調中調用,因此如果您的頁面無效,它將在那里進行驗證。
所以,只需刪除該行即可設置。
試試這個:
<asp:Button ID="btn" runat="server" Text="something" onclick="btn_Click"
ValidationGroup="V1" onClientClick="if(Page_ClientValidate('V1'))
{this.disabled=true;this.value='Please Wait....';__doPostBack(this.id);}
"UseSubmitBehavior="false" />
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.