Saturday, March 24, 2012

Panel Default Button Event Doesnt Fire On Second Submit

I have one UpdatePanel surrounding a asp panel. Inside the panel I have one repeater, two buttons, and two labels. Inside the repeater's ItemTemplate I have an ImageButton and TextBox.

Here is the ASP Code:

1<asp:UpdatePanel ID="AdvancedSearchUpdatePanel" runat="server" UpdateMode="conditional" RenderMode="block" ChildrenAsTriggers="true">2 <ContentTemplate>3 <asp:Panel ID="AdvancedSearchPanel" runat="server" DefaultButton="SubmitSearchButton">4 <asp:Repeater ID="AdvancedSearchRepeater" runat="server">5 <HeaderTemplate>6 <table class="searchButton">7 <tr>8 <td colspan="100%">9 <asp:Label ID="KeywordLabel" runat="server" Text="Search By Keyword" Width="100%" Font-Bold="true"/>10 </td>11 </tr>12 </HeaderTemplate>13 <ItemTemplate>14 <tr>15 <td colspan="100%">16 <table cellpadding="0" cellspacing="0" style="padding-right:5px">17 <tr>18 <td>20 <asp:ImageButton ID="DeleteCriteriaButton" runat="server" ImageUrl="~/Resources/Images/close.gif" AlternateText="Click to Delete" OnClick="DeleteCriteriaButton_Click" />21 </td>22 <td>23 <asp:TextBox ID="KeywordTextBox" runat="server" Text='<%# Container.DataItem%>' CssClass="keywordSearch" Width="123px" OnTextChanged="KeywordTextBox_TextChanged" />24 </td>25 </tr>26 </table>27 </td>28 </tr>29 </ItemTemplate>30 <FooterTemplate>31 </table>32 </FooterTemplate>33 </asp:Repeater>34 <table class="searchButton">35 <tr>36 <td>37 <asp:Button ID="AddAnotherSearchButton" Text="Add Criteria" runat="server" OnClick="AddAnotherSearchButton_Click" />38 </td>39 <td>40 <asp:Button ID="SubmitSearchButton" Text="Submit Search" runat="server" OnClick="SubmitSearchButton_Click" />41 </td>42 </tr>43 <tr>44 <td colspan="100">45 <asp:Label ID="ReadableSqlString" runat="server" />46 </td>47 </tr>48 <tr>49 <td colspan="100">50 <asp:Label ID="ErrorLabel" runat="server" ForeColor="red"/>51 </td>52 </tr>53 </table>54 </asp:Panel>55 </ContentTemplate>56</asp:UpdatePanel>
My problem is that the default button for the panel is the SubmitSearchButton. 
On the first press of the enter key everything works as it should. 
On the second press of the enter key the DeleteCriteriaButton's (ImageButton) event gets fired because it is the first button in the panel. 
The only way I have seen to get around this is to put a button before the ImageButton that has a width of zero and have its event call the SubmitSearchButton event and everything works as should. 
Does anyone know a cleaner way around this problem or a reason this is happening. 
Thanks in advance.
There is a free component that allows you to assign a button to the "enter-pressed" client side event of input controls. If you type some text in textbox and press Enter, the form will postback, and the serverside click event of your button is fired.You don't need to write any code You only need to use control's "DefaultButton" property. It you are a beginner programmer this could be a life saver. More about MetaBuilders DefaultButtons Control you can find at
Wish this can help you.
You can specify a default button through javascript when pressing enter key.Try to take a look at this reading for details -
Here are some sample codes for your reference.
TextBox1.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}; ");
Wish the above can help you.

DefaultButton is working fine for me on a simpler example:

<%@. Page Language="C#" AutoEventWireup="true" EnableEventValidation="false" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""><script runat="server"> protected void click(object sender, EventArgs e) { label1.Text = string.Format("{0} pressed at {1}", ((Control)sender).ID, DateTime.Now.ToString()); }</script><html xmlns=""><head id="Head1" runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <asp:UpdatePanel ID="up1" runat="server"> <ContentTemplate> <asp:Panel ID="panel1" runat="server" DefaultButton="button2"> <asp:TextBox ID="text1" runat="server" /> <asp:Button ID="button1" runat="server" OnClick="click" Text="one" /> <asp:Button ID="button2" runat="server" OnClick="click" Text="two" /> </asp:Panel> <asp:Label ID="label1" runat="server" /> </ContentTemplate> </asp:UpdatePanel> </form></body></html>

This does what you'd expect... every time you type something and press enter, the label displays "button2 pressed at " followed by the current time.

Your sample is considerably more complicated (and hard to reproduce, since I would need to provide a datasource etc.). Could you try simplifying your code to see at what point the issue goes away?

You can't forget that in my code I have repeaters. This might be the problem. My quick fix is to put a button before the delete button and set it to call the submit button's click event. I know this is a hack and I'm working on other issues. Your help is greatly appreciated. FYI, the datasource of the repeater is a List<string>.
I tested your code with a asp:Panel(asp:Repeater) in a asp:UpdatePanel in my PC.My test enviroment isWindows Server 2003 Enterprise,VS.NET 2005 and Ajax RC1.0. I found it?could?work?fine.If?you?click?the?TextBox?and?press?Enter?key in theasp:Panel, the?default?button?of?the?asp:Panel will?be?triggered.If?the?current?focus?was?moved to?the?outside?of?the?asp:Panel?and?press?Enter?key, the?default?button?of?the?asp:Panel?can't?be?triggered.So if you want to pressEnter key in anywhere of the current web form and the default button of theasp:Panel will be triggered, try to focus on aTextBox of theasp:Panel throughjavascript when pressingEnter key in the web form.This should work fine for you.
Sample Code: document.forms[0].elements['txtBox'].focus();
Wish this can help you.
This works in Internet Explorer 7, but not in Fire Fox 2. I'm soooo surprised.

No comments:

Post a Comment