ajax panel ClientEvents-OnRequestStart wont fire

[Mick]

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.

[Kevin]

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.

[Mick]

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.

[Mick]

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.

[Kevin]

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.

[Kevin]

Sorry it should be:

$get(ctrl).click();

[Mick]

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