Lost Button Click when RadNumericTextBox OnTextChanged called

11 posts, 0 answers
  1. Mike Bridge
    Mike Bridge avatar
    96 posts
    Member since:
    Oct 2005

    Posted 25 Mar 2010 Link to this post

    Hi-

    I'm using a RadAjaxManager with some RadNumericTextBoxes and an asp:Button.  The button OnClick and the OnTextChanged are using the RadAjaxManager to update some Labels.

    This works fine until I change the value in the RadNumericTextBox and then try to click on the button directly.  In this case, it seems to lose the click.

    You can reproduce this by:
    1) changing the values using the spinner in each of the two rad input boxes to verify that the "lblTotal" label changes.
    2) click "OK" to show that the date is updated
    3) change a value in one of the RadNumericTextBoxes using the keyboard and then clicking on the OK button directly.

    You'll see that the date doesn't update---it's like an event is being lost somewhere.  This happens in both Firefox and IE8 on build 2009.02.0826.35.

    Any idea what might cause that?

    Thanks!

    -Mike


    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="RadAjaxProblem.aspx.cs" 
        Inherits="Ajax.RadAjaxProblem" %> 
     
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> 
    <!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>Test Ajax</title> 
    </head> 
    <body> 
     <form id="form1" runat="server"
        <asp:ScriptManager ID="scriptManagerProxy1" runat="server"
        </asp:ScriptManager> 
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest"
            <AjaxSettings> 
                <telerik:AjaxSetting AjaxControlID="radNumber1"
                    <UpdatedControls> 
                        <telerik:AjaxUpdatedControl ControlID="lblTotal" UpdatePanelRenderMode="Inline" /> 
                        <telerik:AjaxUpdatedControl ControlID="btnOk" UpdatePanelRenderMode="Inline" /> 
                    </UpdatedControls> 
                </telerik:AjaxSetting> 
                <telerik:AjaxSetting AjaxControlID="radNumber2"
                    <UpdatedControls> 
                        <telerik:AjaxUpdatedControl ControlID="lblTotal" UpdatePanelRenderMode="Inline" /> 
                        <telerik:AjaxUpdatedControl ControlID="btnOk" UpdatePanelRenderMode="Inline" /> 
                    </UpdatedControls> 
                </telerik:AjaxSetting> 
                <telerik:AjaxSetting AjaxControlID="btnOk"
                    <UpdatedControls> 
                        <telerik:AjaxUpdatedControl ControlID="lblMessage" UpdatePanelRenderMode="Inline" /> 
                    </UpdatedControls> 
                </telerik:AjaxSetting> 
            </AjaxSettings> 
        </telerik:RadAjaxManager> 
        
        <div style="margin:50px" > 
            <telerik:RadNumericTextBox ID="radNumber1" runat="server" Type="Number" MinValue="1" 
                AutoPostBack="true" NumberFormat-DecimalDigits="0" Width="75px" ShowSpinButtons="true" 
                Value="1" OnTextChanged="OnNumber1Changed" /> 
            plus 
            <telerik:RadNumericTextBox ID="radNumber2" runat="server" Type="Number" MinValue="1" 
                AutoPostBack="true" NumberFormat-DecimalDigits="0" Width="75px" ShowSpinButtons="true" 
                Value="1" OnTextChanged="OnNumber2Changed" /> 
            equals 
            <asp:Label runat="server" ID="lblTotal"></asp:Label>
            <p> 
                Message: 
                <asp:Label ID="lblMessage" runat="server" Text="..."></asp:Label> 
            </p> 
            <p> 
                <asp:Button runat="server" ID="btnOk" OnClick="btnOk_Click" Text="OK" /> 
            </p> 
        </div> 
        </form> 
    </body> 
    </html> 
     

    using System; 
    using Telerik.Web.UI; 
     
    namespace Ajax 
        public partial class RadAjaxProblem : System.Web.UI.Page 
        { 
            protected void Page_Load(object sender, EventArgs e) 
            { 
     
            } 
     
            private void UpdateTotal() 
            { 
                int arg1 = (int) (radNumber1.Value.HasValue ? radNumber1.Value.Value : 0); 
                int arg2 = (int) (radNumber2.Value.HasValue ? radNumber2.Value.Value : 0); 
                lblTotal.Text = String.Format("{0}", arg1 + arg2); 
            } 
     
            protected void OnNumber1Changed(object sender, EventArgs e) 
            { 
                UpdateTotal(); 
            } 
            protected void OnNumber2Changed(object sender, EventArgs e) 
            { 
                UpdateTotal(); 
            } 
     
     
            protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e) 
            { 
                 
            } 
     
            protected void btnOk_Click(object sender, EventArgs e) 
            { 
                 
                lblMessage.Text = String.Format("OK clicked at " + DateTime.Now.ToLongTimeString()); 
            } 
        } 
     
  2. Mike Bridge
    Mike Bridge avatar
    96 posts
    Member since:
    Oct 2005

    Posted 25 Mar 2010 Link to this post

    I tested this in the most recent release and it still seems to be an issue.

    Thanks,

    -Mike
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. SamJ
    SamJ avatar
    101 posts
    Member since:
    Jul 2008

    Posted 28 Mar 2010 Link to this post

    Hi Mike,

    Can you check if this is not replicable with ASP:UpdatePanel and ASP:TextBoxes? As I was able to observe the same behavior then.

    Regards,
    SamJ
  5. Mike Bridge
    Mike Bridge avatar
    96 posts
    Member since:
    Oct 2005

    Posted 29 Mar 2010 Link to this post

    You're right, it looks like the same thing happens with Textboxes wrapped in an UpdatePanel.

    I'll look into that further.  I assume it has something to do with the postback events conflicting somehow....

    Thanks,

    -Mike



        <form id="form1" runat="server"
        <asp:ScriptManager ID="scriptManager" runat="server"></asp:ScriptManager> 
        <div> 
            <asp:UpdatePanel runat="server" ID="updatePanel1"
                <ContentTemplate> 
                    <asp:TextBox runat="server" ID="txtNumber1" AutoPostBack="true" OnTextChanged="OnNumber1Changed"></asp:TextBox> plus                                                
                    <asp:TextBox runat="server" ID="txtNumber2" AutoPostBack="true" OnTextChanged="OnNumber2Changed"></asp:TextBox> equals 
                    <asp:Label runat="server" ID="lblTotal" AutoPostBack="true"></asp:Label>             
             
                 
            <p> 
                Message: 
                <asp:Label ID="lblMessage" runat="server" Text="..."></asp:Label> 
            </p> 
            <p> 
                <asp:Button runat="server" ID="btnOk" OnClick="btnOk_Click" Text="OK" /> 
            </p> 
                </ContentTemplate> 
                <Triggers> 
                    <asp:AsyncPostBackTrigger ControlID="btnOk" /> 
                </Triggers> 
            </asp:UpdatePanel> 
        </div> 
        </form> 


  6. Mike Bridge
    Mike Bridge avatar
    96 posts
    Member since:
    Oct 2005

    Posted 29 Mar 2010 Link to this post

    I don't know why, but it looks like this works if I delete btnOk from the list of UpdatedControls for the two numeric text boxes:

      <telerik:AjaxSetting AjaxControlID="radNumber1"
                    <UpdatedControls> 
                        <telerik:AjaxUpdatedControl ControlID="lblTotal" UpdatePanelRenderMode="Inline" /> 
                    </UpdatedControls> 
      </telerik:AjaxSetting> 

    It also works in the UpdatePanel example if I move the button outside the UpdatePanel. 

    -Mike

  7. Iana Tsolova
    Admin
    Iana Tsolova avatar
    3388 posts

    Posted 31 Mar 2010 Link to this post

    Hi Mike,

    It seems that there is an issue with input controls events in IE8 after the second ajax request. The DOM elements state is not refreshed/initialized properly and the event handlers are not attached as expected.
    We are researching on it however still not able to find a general solution.

    You can find a possible workaround, you can try handling the onchange client-side event as below:

    <asp:TextBox ID="TextBox1" runat="server" AutoPostBack="true"
        onchange="document.documentElement.focus()"
        OnTextChanged="TextBox1_TextChanged"></asp:TextBox>

    I hope this helps.

    Greetings,
    Iana
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  8. Mike Bridge
    Mike Bridge avatar
    96 posts
    Member since:
    Oct 2005

    Posted 31 Mar 2010 Link to this post

    Just a note: I tried it in both IE and Firefox 3.6 and both seem to have that same issue. 

    Thanks!
  9. Adilet
    Adilet avatar
    1 posts
    Member since:
    Mar 2012

    Posted 13 Mar 2012 Link to this post

    hi all, think a little late, but think the issue is the onblur event of the textbox

    cuz when you attempt to click the button, you dont do it realy
    the first thing is done the onblur of txt, and than the click of the button
    in this case the click is not done because when the focus is lost from the txt the onchange event is called

    could be the explanation for all stranges
  10. Karrie
    Karrie avatar
    12 posts
    Member since:
    Feb 2013

    Posted 01 Apr 2013 Link to this post

    Yes, echoing Adilet, the AutoPostBack doesn't give 'click' a chance to fire. Not Telerik related.
     
  11. Dürdane
    Dürdane avatar
    2 posts
    Member since:
    Jul 2016

    Posted 10 Jul in reply to Mike Bridge Link to this post

    101
  12. Dürdane
    Dürdane avatar
    2 posts
    Member since:
    Jul 2016

    Posted 10 Jul Link to this post

    Yes, echoing Adilet, the AutoPostBack doesn't give 'click' a chance to fire. Not Telerik related.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017