TIPS-Press Enter to Submit Web Page
1 |
大家應該都有過類似的需求吧? 網頁上有一些條件輸入的下拉選單、TextBox、Radio、CheckBox... 後方有一個查詢鈕。使用者多半會期待在輸入完文字後,按下Enter可以自動送出表單。
Browser有時會自動幫完成以上效果,但必須符合某些條件時才會成立,例如: Form中只有一個Button之類的。並不是所有情境都能滿足這些先決條件,於是我們看到開發人員開始大顯神威,用Javascript掛onkeydown,呼叫form.submit()... 忙得不亦樂乎。還有一種做法是用Page.RegisterHiddenField( "__EVENTTARGET", myButton.ClientID );的方式指定按Enter時要觸發的Button,但它也有一些情境上的限制(可以參考這篇Blog的詳細討論)。
好消息是ASP.NET 2.0裡新加了一個好用的屬性--DefaultButton,可以指定Form在按下Enter時預設要觸發的Submit Button。更棒的是,我們可以在Form裡插入多塊Panel Control,每個Panel都可以指定自己的DefaultButton,當焦點停在不同的Panel,按下Enter就會觸發該Panel自己的DefaultButton,在設計複雜的UI時,十分方便。
順便提一下,HtmlForm還加了另一個很讚的新屬性--DefaultFocus,可以指定網頁載入後,Focus要停在哪個Control上。在以前,這都得自己設法寫Javascript搞定,現在ASP.NET 2.0直接支援,雖是好事一椿,對我們這種曾經在Javascript下過苦功的老骨頭來說,與新鮮人的開發能力差距正快速縮小中,還真有點哭笑不得,哈!
Comments
# by 阿舒
請問,我在form的屬性上的DefaultButton 是空白的,而我Edit 有一javascript onBlur 事件處理輸入檢查,但是我key入Edit後,直接按了"Enter",確會執行button送出,這是為什麼? 我要怎麼設定才能停止不送出呢? 或是 javascript 要怎樣才會停止不繼續執行到 送出呢? 謝謝。