ajax panel ClientEvents-OnRequestStart wont fire

7 posts, 0 answers
  1. Mick
    Mick avatar
    40 posts
    Member since:
    Oct 2006

    Posted 08 Dec 2011 Link to this post

    Hi

    I have found an issue where I cannot get  ClientEvents-OnResponseEnd="onResponseEnd" ClientEvents-OnRequestStart="onResponseStart" events to fire in javascript when I do a manual postback - however the server side event code does run in ajax mode.

    for instance I have an asp button in a page with a server event wrapped in an ajax panel with the 2 javascript events wired up.

    If I use the mouse to click the button then it works fine - both the onResponseStart and onResponseEnd javascript functions work.

    However in the folloiwng situation I want to click the button in code and not with the mouse. In this case I have wired an event for the <CR> key being clicked in a radtextbox to fire the mouse click event of the button as follows

    ASCX FILE Rad Text Box that allows <CR> to be pressed and then runs the __dopostback code for a button click
                 <telerik:RadTextBox ID="bxPNCID" runat="server" SelectionOnFocus="SelectAll" Skin="Vista"
                  Width="200px" onkeydown="return OverridePostBackOnEnter(event, 'ImageButton6')">
                 </telerik:RadTextBox>

    ASCX IMAGEBUTTON 6 - The button Click I want to emulate - I needed ClientIDMode="Static" because document.getelementbyid function needs the rendered ID rather than the aspx ID
              <asp:ImageButton ID="ImageButton6" ClientIDMode="Static" runat="server" Style="float: right;
               margin-top: -44px" ImageUrl="images/butt_searchcustrecoff.png" AlternateText="Search Custody Records"
               ToolTip="Search Record" OnClick="SearchRecords_Click" />

    JAVASCRIPT FUNCTION TO HANDLE THE KEYPRESS AND CONVERT TO MOUSE CLICK
            //attach OverridePostBackOnEnter to keypress of textbox
            //onkeypress="OverridePostBackOnEnter(event, 'Id of click button')" -- Firefox
            //onkeydown="OverridePostBackOnEnter(event, 'Id of click button')" -- IE
            //Remember set 'ClientIdMode' of controlling button to 'STATIC'
            function OverridePostBackOnEnter(event, ctrl)
            {
                if (event.keyCode == 13)
                {
                    if ($.browser.mozilla)
                    {
                        var overridectrl = document.getElementById(ctrl);
                        __doPostBack(overridectrl.name, '');
                    }
                    else
                    { //for IE
                        //but for other browsers you should use
                        var overridectrl = document.getElementById(ctrl);
                        __doPostBack(overridectrl.name, ''); // everything I have researched says it should be uniqueID for IE but does not seem to fire the server event
                    }
                }
            };

    to summarise the code above then
    the radtextbox has the onkeydown event fire
    the JS Routine OverridePostBackOnEnter(event, ctrl) runs  and checks for the key being <CR>
    The JS Routine then does the __doPostBack event.
    (AjaxPanel Runs The OnResponseStart Function - DOES NOT HAPPEN)
    The Server Code runs the mouse click event.
    (AjaxPanel Runs The OnResponseEnd Function - DOES NOT HAPPEN)

    The ajax control did not fire the onResponseStart and onResponseEnd javascript routines which do run if I click button6 using the mouse.

    Any help greatly appreciated guys.

    regrads Mick.
  2. Kevin
    Kevin avatar
    360 posts
    Member since:
    Jul 2012

    Posted 08 Dec 2011 Link to this post

    Hello Mick,

    To answer your questions about why the OnResponseStart and OnResponseEnd events do not get raised is because you are using a UserControl. Apparently when you set the UserControl as the Ajax initiator, those events do not get raised for some reason. You need to wrap the UserControl inside of a panel and set that as the ajax initiator and those events should work.

    I hope that helps.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Mick
    Mick avatar
    40 posts
    Member since:
    Oct 2006

    Posted 08 Dec 2011 Link to this post

    Hi Kevin, thanks for your reply.

    Not sure we are on the same though pattern here Kevin or maybe I am misinterpreting what you are saying.

    Everything works fine and all events fire when i use the mouse to initiate the __doPostBack as happens auttomatically for me thanks to the rad ajax panel the controls are sat in, as I assume that radajax panel itself is responsible for firing a __dopostback event eventually.

    However my issue relates to manual calling of __doPostBack which does not run the JS events for the rad ajax panel, the button and the rad text box are both placed inside the rad ajax panel.
  5. Mick
    Mick avatar
    40 posts
    Member since:
    Oct 2006

    Posted 08 Dec 2011 Link to this post

    I have found a solution of sorts
    Its not ideal as it does not directly call the server event.


    i changed the javascript function to this

            function OverridePostBackOnEnter(event, AjaxPanelClientID, AjaxPanelUniqueID, AjaxRequestEventArgs)
            {
                if (event.keyCode == 13)
                {
                    $find(AjaxPanelClientID).ajaxRequestWithTarget(AjaxPanelUniqueID, AjaxRequestEventArgs);
                }
            };

    In the ascx page I first collect the ids in a javascript function.

         var apCID = '<%=RadAjaxPanel1.ClientID %>';
         var apUID = '<%=RadAjaxPanel1.UniqueID %>';

    the surname edit box now looks like this

                 <telerik:RadTextBox ID="bxSurname" runat="server" SelectionOnFocus="SelectAll" Skin="Vista"
                  Width="200px" onkeydown="return OverridePostBackOnEnter(event, apCID, apUID, 'searchrecs')">
                 </telerik:RadTextBox>

    My server side function does this
            protected void RadAjaxPanel1_AjaxRequest(object sender, AjaxRequestEventArgs e)
            {
                string[] ajp = e.Argument.Split('|');
                switch (ajp[0])
                {
                    case "searchcustrecs":
                        SearchCustodyRecords_Click(null, null);
                        break;
                }
            }

    This now runs the server routine protected void RadAjaxPanel1_AjaxRequest(object sender, AjaxRequestEventArgs e)
    By passing the ajaxrequesteventargs across I can manually run the server side button click from within the RadAjaxPanel1_AjaxRequest
    This now runs all the ajax panel client javascript and all the server side code.

    it was a long road but we got there eventually.

    Thanks for your help Kevin.
  6. Kevin
    Kevin avatar
    360 posts
    Member since:
    Jul 2012

    Posted 09 Dec 2011 Link to this post

    Hello Mick,

    I guess I did mis-understand you. Instead of calling the __doPostBack method to raise the click event of your ImageButton, have you tried doing this:

    $get(overridectrl.name).click();

    Hopefully that should raise the OnRequestStart and OnRequestEnd events, while also raising the click event of the ImageButton.
  7. Kevin
    Kevin avatar
    360 posts
    Member since:
    Jul 2012

    Posted 09 Dec 2011 Link to this post

    Sorry it should be:

    $get(ctrl).click();
  8. Mick
    Mick avatar
    40 posts
    Member since:
    Oct 2006

    Posted 09 Dec 2011 Link to this post

    Yes this works a treat, thanks.It was still an interesting journey though, going through the __dopostback event code even though it turns out to be unnecessary.
    my understanding is much better than it was although still; not complete when it comes to the event args.

    Thanks for your help Kevin
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017