設定按鈕不可用，避免重複提交

專案中經常出現使用者重複提交的情況，為了防止這種情況，最常用的方法就是在使用者點選按鈕後將該按鈕設為不可用，筆者在實際開發當中遇到了多種不同的情況，在此做個小結，以供參考。

第一種情況是非submit型別的按鈕

這種情況比較簡單，只要在客戶端新增事件，將按鈕設為不可用就可以了。看下面的程式碼：

ASP.NET-Code:


C#-Code:
protected void btn_Click(object sender, EventArgs e){ System.Threading.Thread.Sleep(1000); lbl.Text = DateTime.Now.ToString();}

第二種情況是submit型別的按鈕

此時第一種方法就不行了，按鈕被設為DISABLED之後就無法完成提交，我們可以適當修改程式碼：

ASP.NET-Code:


C#-Code:
protected void Page_Load(object sender, EventArgs e){ if (!Page.IsPostBack) { btn.OnClientClick = "this.disabled=true;" + GetPostBackEventReference(btn); }}
與第一種方法不同的是我們在Page_Load中給按鈕新增客戶端事件，並附加了GetPostBackEventReference。但這樣做還有個缺 陷，在第一提交回發完成以後，再點選按鈕就會失敗，因此我們需要去掉if (!Page.IsPostBack)這句，也就是每次回發都要重複繫結客戶端事件。

第三種情況跟第一種類似，只是多了個UpdatePanel

ASP.NET-Code:


第四種情況也是在UpdatePanel裡面，不過和第二種情況一樣，也是Submit型別的按鈕

和第二種情況不同的是，我們只需要在第一次載入的時候繫結客戶端事件就可以了，即在 if (!Page.IsPostBack){}中繫結事件。

第五種和第四種不同的是，按鈕在UpdatePanel外面，透過觸發器來重新整理指定的UpdatePanel

如果按第四種的方法，可以在點選按鈕後設為不可用，但回發完成以後該按鈕不會恢復可用狀態：

ASP.NET-Code:


C#-Code:
protected void Page_Load(object sender, EventArgs e){ if (!Page.IsPostBack) { btn.OnClientClick = "this.disabled=true;" + GetPostBackEventReference(btn); }}protected void btn_Click(object sender, EventArgs e){ System.Threading.Thread.Sleep(1000); lbl.Text = DateTime.Now.ToString();}
為了解決這個問題，最簡單的方法就是將該按鈕放在另一個UpdatePanel裡面，這樣每次都可以恢復原狀態了。另外還可以根據Atlas的頁面週期，在提交完成以後顯式將該按鈕設為可用。

 

注：在Asp.Net中所有預設的按鈕都是Submit型別，如果要是有button型別則，需要設定 UseSubmitBehavior="false"；

Submit是專門用於提交表單的Button，與Button的區別主要有兩點：
　　type=button 就單純是按鈕功能
　　type=submit 是傳送表單
　　 (1)Submit將表單提交(form.submit())作為其onclick後的預設事件，Button並非如此
　　 (2)表單提交時，所有具有name屬性的html輸入元素(包括input標籤、button標籤、select標籤等)都將作為鍵值對提交，除了Submit物件。Submit物件只有在自己被單擊後的提交中才會作為鍵值對被提交。
　　但是對於從事WEB UI的人應該要注意到，使用submit來提高頁面易用性：
　　
　　使用submit後，頁面支援鍵盤enter鍵操作，而很多WEB軟體設計師，可能沒有注意到submit統一.
　　
　　用button後往往頁面不支援enter鍵了。所以需要支援enter鍵，必須要設定個submit，預設enter鍵對頁面第一個submit進行操作。
　　
　　
　　執行完onClick，轉到action。可以自動提交不需要onClick。所以說onclick這裡可以不要。
　　
　　執行完onClick，跳轉檔案在 js檔案裡控制。提交需要onClick。
　　比如：
　　1，onclick="form1.action='a.jsp';form1.submit();" 這樣就實現了submit的功能了。
　　
　講白一些，就是submit會有一個跳轉，頁面會重新整理；而button不會重新整理，就是一個button；可以用來生成按鈕，更加靈活，樣式更好控制。 (如果客戶端禁用JS，則使用Submit時，前臺驗證就會失效，後臺就可能獲取到非法的資料)