Total Pageviews

Monday, May 17, 2010

Capturing Key stroke and Do the post back

With the invention of Web 2.0 customers are becoming more and more demanding when it comes to interactive Web UI.With application being moved from Desktops to web, end users demand that the web application provide them the same look and feel as they had in their legacy desktop applications.Well this includes Key combinations provided by the desktop applications to do some quick tasks like “save”, “Edit” etc to name a few.Providing this feature in Web application is a bit tricky but using JavaScript this can be done.

Well the first step in the process is to capture the Key press event that has happened when the user has pressed some key while he is using you web page.

The way to do this is something like this.

The KeyID will provide you with a number that indicates which key was pressed. You can build a logic based on the value of KeyID. You can also use the key combinations and like “cntrl+S” etc.

The below code is written and tested to do post back for various keys press events.

First add this JavaScript to your page.

This script does a post back and passes the name of the key pressed as the value of the “Request["__EVENTARGUMENT"]” key in the Request object.
For making the “__doPostBack” to work we will have to do some register the postback event reference during page load. The code below explains how it is done
protected void Page_Load(object sender, EventArgs e)

{

Page.ClientScript.GetPostBackEventReference(this, "");
string eventArgs = Request["__EVENTARGUMENT"];if(!string.IsNullOrEmpty(eventArgs))

{
switch (eventArgs)

{
case "F7":

DoF7();

break;
case "F8":

DoF8();
break;case "F9":

DoF8();

break;
case "F10":

DoF8();
break;

}

}

}

Based on the value received in the Request["__EVENTARGUMENT"] we can take appropriate action during postback.

No comments:

Post a Comment