Introduction
When I start programming with ASP.NET I used to face problems with enter key. Clicking enter key won't make a button click at all times. It will post back the form, but the relevant button you wanted to call won't be called. I read several articles which discuss this problem and tried some of the methods suggested by them. But nothing gave me a stable performance. So I created a library that can set default button for text box control when the enter key is pressed.
Identifying problem
Hitting enter key on ASP.NET pages will produce really different results. It varies on each browser. You can test it by placing one text box and one button on a webform. Write some code in button's onclick event. It could be some thing like
Response.write("You clicked this button");
Try debugging the program. Pressing enter key on the text box will make a postback. But whatever code you written inside button click won't be executed. This will work some time in firefox.
Then I found some ASP.NET developers was saying, "you can achieve this by putting one hidden field". So I placed something like this.
Start debugging again. Now pressing enter key will post form and execute the code for the button's onclick. Looks strange !
But that worked as temporary solution. This method can't be implemented when there is more than one button.
Assume you have two text boxes and two buttons. Hitting enter key from first text box should call first button and second text box should call second button. In this case hidden textbox method fails. It will call one button every time.
To solve this and make it work with all situations we can use javascript.
Using javascript for solution
txtBox1.Attributes.Add("onkeydown", "if(event.which event.keyCode){if ((event.which == 13) (event.keyCode == 13)) {document.getElementById('"+Button1.UniqueID+"').click();return false;}} else {return true}; ");
Adding the above attribute to the textbox will solve the problem. The keycode for enter key is 13. When a key is pressed in textbox it will check the keycode is 13. If it is 13 the relevant button will be clicked. event.keycode will not work with firefox, so we are using event.which.
Porting into DefaultButton class
I ported the same code into a class. Using this you can pass the textbox object and button object. It will set the necessary scripts for making enter key working. There are two static methods in DefaultButton class. One is for normal asp.net button and next is for image button.
To set default button for one text box follow these steps
Add reference to the library
Import System.Web.UI.DefaultButton namespace
Use DefaultButton.SetDefaultButton ( control , btButton )
This method will add keydown attribute for the textbox control and calls button when enter key is pressed.
Setting default buttons in ASP,NET 2.0
ASP.NET 2.0 comes with defaultbutton property. You can set default button for form and panels. This will be called when form is posting back using enter key.
License
No comments:
Post a Comment