ASP.NET 多個提交按鈕頁面,ENTER指定執行某一按鈕

在WEB頁面上,通常SUBMIT類型的按鈕會被默認指派爲所在FORM表單的提交按鈕。

我們在做ASP.net WEB應用的時候,常常遇到會在同一個頁面裏添加多個按鈕,而每個按鈕肯定都會觸發頁面回送事件。

在ASP.NET中,只能指定一個帶有RUNAT=SERVER的FORM表單,因此,這個表單會指派哪個按鈕爲默認提交按鈕呢?

不做任何處理的情況下是很難控制的,例如在同一個頁面裏做了N個搜索框,設計上理想的思路是在某一輸入框輸入關鍵字後,用戶按ENTER鍵,執行當前輸入的輸入框對應的提交按鈕,但是,實際上往往事與願違。無論怎麼提交,總是會只執行某一個按鈕事件。

網上很多方法都是使用JAVASCRIPT來進行判斷,在輸入框中加入KEYPRESS之類的事件,然後檢查eventCode,如果是回車鍵,那麼就指定執行某一個按鈕。

這個方法不是不行,但是,並不好維護,而且在處理複雜的邏輯時,往往不好控制。

其實,ASP.NET給出了很好的解決方案,只是通常不被人注意。

首先,屏蔽瀏覽器提交模式,也就是說,FORM不再默認指定一個ENTER提交的按鈕

方法是將BUTTON的UseSubmitBehavior設置爲false,這樣這個按鈕就不會接受回車提交,這樣就不會出現用戶焦點在頁面某處聚焦時按回車提交的情況。

爲什麼會這樣呢?查看頁面源文件我們會發現本來ASP.NET的BUTTON服務器控件在發送到客戶端後type="submit",但這時UseSubmitBehavior設置爲false後,type="button" ,而且多了一個onclick事件,內容是"javascript:__doPostBack('Button1','')" id="Button1",這樣,就說明,這個按鈕不再是FORM的提交按鈕了,而只是一個普通按鈕,要提交頁面必須執行click事件,所以怎麼點回車,也不會執行這個按鈕的提交事件。

剛纔只是第一步,阻止了默認的提交。但是,我們要的效果是回車可以提交啊。只是設置這一個屬性當然無法達到我們想要的效果。

接下來,我們要了解Panel控件。

其實Panel控件是非常有用的,他是一個容器,在ASP.NET的Panel控件中有一個屬性 DefaultButton 這個屬性在ASP.NET的FROM控件中也有。

Panel是一個特殊的控件 MSDN上的說明是:使用Panel 控件來組織 Form、另一 Panel 或模板中的內容和控件。

也就是說Panel是ASP.NET對FORM的一個補充,可以給表單分區域的控件,這也是爲什麼ASP.NET AJAX容器使用該控件的原因。

我們都知道,ASPX只能有一個runat=“server”的FORM表單,那麼要進行細緻,具體的FORM操作怎麼辦,那麼就得靠Panel控件

這裏,我們就會用到Panel的這個功能

將一組輸入框和按鈕放在一個Panel中,指定該Panel的DefaultButton屬性爲按鈕ID,這樣,當用戶焦點處於這個Panel內的某一控件時,點擊回車就會執行這個Panel的DefaultButton所指定的按鈕。

Panel是Form的補充控制,可以通過使用Panel對錶單進行更多的操作,這樣,ASP.NET只能擁有一個Form所引起的一些困難都可以迎刃而解。

實例代碼就不具體寫了,畢竟只是設置一下控件屬性,並不困難,只是大部分人沒有注意到這個問題。

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章