How To Create Shortcut Key in ASP.NET

Many times when working with the Web Application, you would like to give the user the comfort of getting the job done without using the mouse. It can be of great use to the user if they can perform many tasks using the keyboard in a web application. If you have used Gmail, you would know how easy it can be to select mails using some key. This feature can be implemented in Asp.net also very easily.

In my example, I will talk about how to link a key button with the click event of a button. What we will do is bind the keyboard shortcut to the click event of a button. Hence the task will be performed on both keyboard click and mouse click of the button.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default7.aspx.cs"
 Inherits="Default7" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
   <title>Untitled Page</title>
  <script type="text/javascript">
  document.attachEvent('onkeyup', KeysShortcut);

// Now we need to implement the KeysShortcut
function KeysShortcut ()

{

    if (event.keyCode == 49)

    {
      document.getElementById('<%= button1.ClientID %>').click();

    }

}
  </script>
</head>
<body>
   <form id="form1" runat="server">
   <div>
   <asp:ScriptManager ID="a" runat="server"></asp:ScriptManager>
   </div>
  <div id="target" style="background-color: gray">This is a simple div</div>
    <asp:Button ID="button1" runat="server" />
   </form>
</body>

</html>
Reactions

Post a Comment

7 Comments

  1. thanks santosh, i was searching similar kind of script since long. excellenet

    ReplyDelete
  2. Wonderful. I wonder how to implement Combinatory Shortcut Keys like "CTRL+B", "Alt+SHIFT+K",...etc. Would you give me some sample code for this?

    ReplyDelete
  3. Try this to implement combinatory shortcut keys...


    var isCtrl = false;
    document.attachEvent('onkeyup', KeyUpHandler);
    document.attachEvent('onkeydown', KeyDownHandler);

    function KeyUpHandler()
    {
    if (event.keyCode == 17)
    {
    isCtrl=false;
    }
    }

    function KeyDownHandler()
    {
    if (event.keyCode == 17)
    {
    isCtrl=true;
    }
    if (event.keyCode == 83 && isCtrl == true)
    {
    ' call button save click event document.getElementById(btnSave).click();
    }
    else if (event.keyCode == 67 && isCtrl == true)
    {
    ' call button close click event document.getElementById(btnClose).click();
    }
    }



    Shortcut key codes:
    keyCode 16: "Shift";
    keyCode 17: "Ctrl";
    keyCode 18: "Alt";
    keyCode 19: "Pause";
    keyCode 37: "Arrow Left";
    keyCode 38: "Arrow Up";
    keyCode 39: "Arrow Right";
    keyCode 40: "Arrow Down";

    ReplyDelete
  4. what if i want to trigger a button that is inside GridViewRow? Please help.

    ReplyDelete

Please do not post any spam link in the comment box😊

Emoji
(y)
:)
:(
hihi
:-)
:D
=D
:-d
;(
;-(
@-)
:P
:o
:>)
(o)
:p
(p)
:-s
(m)
8-)
:-t
:-b
b-(
:-#
=p~
x-)
(k)

Close Menu