Wednesday, March 21, 2012

Default Button Issue

Hi Everyone

I have a asp Panel with few textboxes and two ImageButtons - imgbtnSave and imgbtnCancel

Now what i want that whenever the user presses enter button as long as he is inside that asp Panel, the default button (say I want "imgbtnSave" as Default Button) works.

Note : - I am using my own JavaScript code for DateValidation. So if i use inbuilt defaultButton property of asp Panel then DateValidation fails. I cant change the DateValidation function now as my project is on deliverey stage. So i want JavaScript Code for Default Button

Thanx in advance

you want to set focus to ImageSave button

you can do like this

write the function in javascript

<script type="text/javascript" language="javascript">
function setFocus()
{
document.getElementById("<%= Button.ClientID %>").focus();


}
</script>

call this function like this

protected void ButtonAddCategory_Click(object sender, EventArgs e)
{

ClientScript.RegisterStartupScript(typeof(Classname), "Focus", "setFocus();", true);

}

give me the feedback

-----------

mark as Answer if you feel


Hi Manoj

Thanx for your valuable time....

The solution you have given works in the condition where we have one textbox associated with a single Button.

Now suppose i have Panel inside which i have 60 textBoxes and One Imagebutton

And Other Panel inside which i have 20 textboxes and 2 ImageButton.

Now what should i do???
Hope u understand now

Bye and Take Care

Thanx in advance


Hi DeepakTake a look at the following code:

1 private void SetDefaultButton(TextBox control, Button btButton)
2 {
3 control.Attributes.Add("onkeydown",
4 "if(event.which || event.keyCode)"
5 +"{"
6 + "if ((event.which == 13) || (event.keyCode == 13)) "
7 + "{"
8 + "document.getElementById('" + btButton.UniqueID +"').click();"
9 + "return false;"
10 + "}"
11 +"}"
12 +"else"
13 +"{"
14 + "return true;"
15 +"};" );
16 }
17
18 private void SetDefaultButton(TextBox control, ImageButton btButton)
19 {
20 control.Attributes.Add("onkeydown",
21 "if(event.which || event.keyCode)"
22 +"{"
23 +"if ((event.which == 13) || (event.keyCode == 13)) "
24 +"{"
25 +"document.getElementById('" + btButton.UniqueID +"').click();"
26 +"return false;"
27 +"}"
28 +"}"
29 +"else"
30 +"{"
31 +"return true;"
32 +"};");
33 }
34
35 protected void Page_Load(object sender, EventArgs e)
36 {
37 SetDefaultButton(this.TextBox1,this.Button1);
38 SetDefaultButton(this.TextBox2,this.Button2);
39 SetDefaultButton(this.TextBox3,this.ImageButton1);
40 }
41
42 protected void Button1_Click(object sender, EventArgs e)
43 {
44 this.Label1.Text ="Button 1 was clicked";
45 }
46
47 protected void Button2_Click(object sender, EventArgs e)
48 {
49 this.Label1.Text ="Button 2 was clicked";
50 }
51
52 protected void ImageButton1_Click(object sender, ImageClickEventArgs e)
53 {
54 this.Label1.Text ="Image button was clicked";
55 }
56

And on the .ASPX page, I have the following the following controls:

1 <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label><br />
2 <br />
3 <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
4 <asp:Button ID="Button1" runat="server" Text="Button 1" OnClick="Button1_Click" /><br />
5 <br />
6 <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
7 <asp:Button ID="Button2" runat="server" Text="Button 2" OnClick="Button2_Click" /><br />
8 <br />
9 <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
10 <asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/Images/Save.png" OnClick="ImageButton1_Click" />

I have placed three textboxes, and each has an associated button.  The third textbox has an imagebutton
next to it. Enter something in the textbox, and press the enter key. It executes the associated click event
for each of them.
The trick over here is to add a small piece of JavaScript code.  I have formatted the code so that you can
understand what it actually does. The trick here is that since I need to make sure it works for IE and Firefox,
I have identify the ENTER KEY (key code 13), using both event.keyCode and event.which (for FireFox), to
fire its respective click.
And to make this implementation easily replicatable, I have turned this JavaScript add-on as a generic function,
which is called from the Page_Load method (as shown in this example). It is overloaded to handle both ordinary
buttons, and imagebuttons.
Hope this helps.
In case you find this suitable, please don't forget to mark it as the answer.
Happy coding!
MANOJ KUMAR SHARMA
www.manojkumarsharma.com

No comments:

Post a Comment