Here are some DHTML tricks i've been using to make the user experience a bit more keyboard-friendly. These are all specific, but general in nature. First up, I want to set the input focus to a specific textbox by default, so the user doesn't have to click on it to begin typing. Add the following line just under your textbox in the aspx page:
<script>$('<%= txtMyTextBox.ClientID %>').focus();</script>
Next up, i want it to leave an 'edit' page and jump back to an item listing page if the user hits escape, rather than having to click on a 'cancel' link. To do this, i add this somewhere in the aspx page:
   // So that when the user hits escape it will return to the list
   function keyPressHandler(e) {
      var kC  = (window.event) ?    // MSIE or Firefox?
                 event.keyCode : e.keyCode;
      var Esc = (window.event) ?   
                27 : e.DOM_VK_ESCAPE // MSIE : Firefox
   document.body.onkeypress = function(e) {keyPressHandler(e);};
Finally, i want the application to click a certain 'save' button when the user hits enter. To do this, surround all the controls in a panel, and set its 'DefaultButton' setting:
<asp:Panel ID="pnlSearch" runat="server" DefaultButton="bnGo">
      <asp:TextBox ID="txtSearch" runat="server" Columns="6"></asp:TextBox>
      <asp:Button ID="bnGo" runat="server" Text="Go" OnClick="bnGo_Click" />
With these simple changes, my page is now a whole lot more keyboard friendly, which is much faster for a power user.

Thanks for reading! And if you want to get in touch, I'd love to hear from you: chris.hulbert at gmail.

Chris Hulbert

(Comp Sci, Hons - UTS)

iOS Developer (Freelancer / Contractor) in Australia.

I have worked at places such as Google, Cochlear, Assembly Payments, News Corp, Fox Sports, NineMSN, FetchTV, Coles, Woolworths, Trust Bank, and Westpac, among others. If you're looking for help developing an iOS app, drop me a line!

Get in touch:
[email protected]

 Subscribe via RSS