RadAjaxManager null on repeat callback

[Dasha]

Hello,

I realize that this issue is not new to the forum.  Unfortunately I haven't been able to find a resolution to my problem in the previous threads. Maybe you can point me in the right direction.  I have a Sharepoint web part that consists of a grid and an RadAjaxManager. The control code looks like this:

<telerik:RadAjaxManager ID="cwAjaxManager" OnAjaxRequest="UpdateGrid" runat="server">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="cwAjaxManager">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="lblGridJS" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" SkinID="Default">
    <asp:Label ID="lblGridJS" runat="server"></asp:Label>
    <telerik:RadGrid ID="CWGrid" runat="server" Width="100%" OnNeedDataSource="CWGrid_NeedDataSource">
    </telerik:RadGrid>
</telerik:RadAjaxPanel>
<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Transparency="30"
    SkinID="Default" BackColor="#dff3ff">
    <asp:Image ID="Image1" runat="server" ImageUrl="/_LAYOUTS/CorasWorksDIT/CorasWSC.Grid.Display/loader.gif">
    </asp:Image>
</telerik:RadAjaxLoadingPanel>

Pretty straight forward, nothing fancy. And I also have some links (not part of the web part control) on the page that when clicked kick off a javascript function that's supposed to call the async request on the ajax manager. Here's the code:

function clickLink(connName) {
    var urlVariables = "CN=" + connName;

    var controlId = GetControlIdMyGrid();
    window.setTimeout(function () { cwInitiateAsyncRequest(controlId, urlVariables); }, 10);
}

function cwInitiateAsyncRequest(controlId, argument) {
    var ajaxManager = $find(controlId + "_cwAjaxManager");
    if (ajaxManager != null) ajaxManager.ajaxRequest(argument);
    else {
        ajaxManager = $telerik.$.find(controlId + "_cwAjaxManager");
        if (ajaxManager != null) ajaxManager.ajaxRequest(argument);
    }
    return false;
}

The first time a link is clicked, the request goes through fine, everything works great.  The second time around $find(controlId + "_cwAjaxManager") returns null, and $telerik.$.find(controlId + "_cwAjaxManager") returns {...}, which is not really null, but at the same time whatever it is, it has not methods or properties, so the ajaxRequest fails.  As you can see I tried the timeout solution with no luck.  Is there anything else that I may try?

[Dasha]

Some additional investigation:
From digging into the page's javascript, it does not look like the Sys.Application._components collection hold the ajax manager on a second callback.  It has the grid and the loading panel, but not the ajax manager, which would explain why it comes back null.  Could it be something specific to the Sharepoint environment?

[Iana Tsolova]

Hello Dasha,

Can you try removing the RadAjaxManager and invoke the ajax request calling the RadAjaxPanel ajaxRequest() method instead?

Sincerely yours,
Iana
the Telerik team

[Dasha]

Iana,

thank you for the suggestion, but I just tried it and I'm seeing the same behaviour - the RadAjaxPanel is only available for the first call, and it disappears afterwards.  What's interesting is that the ajax control seems to be present in the Sys.Application._components collection until its ajaxRequest() method is called.  So if I have both the Ajax Manager and an Ajax Panel on the page, i can make one ajax request for each of them without refreshing the page in between, but once a control is called upon, it disapperas from the collection and is no longer available for the ajax request.

[Simon]

Hello,

I've got the same problem, but i've found a suitable workaround for me, which might helps you as well. My page looks like that:

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="btnSubmit">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="pnlMain" LoadingPanelID="RadAjaxLoadingPanel1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Transparency="1" Skin="Default"/>
...
<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
<script type="text/javascript">
    function openCalendar() {
        var oWnd = $find('<%= CalenderDialog.ClientID %>');
        oWnd.show();
    }
</script>
</telerik:RadScriptBlock>
...
<asp:Panel ID="pnlMain" runat="server">
                    <asp:Button runat="server" CssClass="CommandButton" ID="btnSubmit" Text="Submit"
                        Visible="false" />
                    <asp:HyperLink ID="hypCalendar" runat="server" NavigateUrl="javascript:openCalendar();">Open calendar </asp:HyperLink>
</asp:Panel>

<telerik:RadWindow ID="CalenderDialog" runat="server" Title="Kalender" Width="600"
    Height="450" VisibleOnPageLoad="false" Behaviors="Close" AutoSize="true" Modal="true"
    EnableShadow="true" VisibleStatusbar="False" VisibleTitlebar="true" ShowContentDuringLoad="false">
</telerik:RadWindow>

The Javascript works as long as nobody triggers an ajax postback. The JavasScript throws an exception after the first postback because the ClientID of the RadWindow seems to be inaccessible and it's not anymore on the list of Sys.Application._components. So i decieded to move the RadWindow into the pnlMain, which will be updated by the RadAjaxManager. This solution works. It seems that there is a bug in reregistration of the client controls. I'm not quite sure whether you can update der RadAjaxManager itself or not.

Sincerely yours,
Simon Meraner

[Dasha]

Thanks Simon for your suggestion. I also ended up finding a hack of my own which seems to work. Here's the code:

function cwInitiateAsyncRequest(controlId, argument) {
    var ajaxManager1 = $find(controlId + "_cwAjaxManager");

    if (ajaxManager1 != null && ajaxManager1.ajaxRequest) ajaxManager1.ajaxRequest(argument);
    else {
        //the ajax manager will be null on a repeat call back
        //so need to re-create it
        //very important to set the _uniqueID property, otherwise the call back will not reach the server
        $create(Telerik.Web.UI.RadAjaxManager, null, null, null, $get(controlId + "_cwAjaxManager"));
        ajaxManager1 = $find(controlId + "_cwAjaxManager");
        ajaxManager1._uniqueID = $find(controlId + "_CWGrid").UniqueID.replace('CWGrid', 'cwAjaxManager');
        ajaxManager1.ajaxRequest(argument);
    }

    return false;
}

However I do really think that it's a total hack :) So maybe a long-term more stable solution will be abailable at some point.

[mpoi]

Are there any updates?
The solution of Dasha works for me, but the Page "refresh's" itself several times before the ajax request has been done...

I was using a RadAjaxPanel instead the Manager.

At everything on Page will be ready, I have to make an ajax request.
So I implemented the following script to javascript-section:

$(document).ready(function () {

            var ajaxPanel1 = $find('<%= ajaxPanelListBox.ClientID %>');

            if (ajaxPanel1 != null) ajaxPanel1.ajaxRequest('');
            else {

                $create(Telerik.Web.UI.RadAjaxPanel, null, null, null, $get('<%= ajaxPanelListBox.ClientID %>'));

                ajaxPanel1 = $find('<%= ajaxPanelListBox.ClientID %>');
                ajaxPanel1._uniqueID = $find('<%= ajaxPanelListBox.ClientID %>').UniqueID;


                ajaxPanel1.ajaxRequest('');
            }
 });

Plz help!
Marco

[Iana Tsolova]

Hi Marco,

You should not call the $create method manually. It will be called when the controls is ready to be created. However you might already found that the $(document).ready event is fired before the RadAjaxPanel client-side object is created. In this case, I would suggest that you move your javascript to the pageLoad event instead when all client-side objects would be created.

Regards,
Iana
the Telerik team

[mpoi]

Hi telerik team,

in "code behind" - Page_Load()/ Page_LoadCompleted() the script part

var ajaxPanel1 = $find('<%= ajaxPanelListBox.ClientID %>');

always returns "null". Thats the reason I implemented jQuery/ $(document).ready to the project.

Because the $(document).ready causes a postback which will call itself again and again (I don't know why?), I decided to turn to implement that handling in "code behind" - Page_LoadCompleted().

This looks like that:

protected void Page_LoadComplete(object sender, EventArgs e)
{
    Type cstype = this.GetType();
    ClientScriptManager cs = Page.ClientScript;

    if (!InitialLoadCompletedPart1)
    {
         String csname1 = "myInitScript";

         if (!cs.IsStartupScriptRegistered(cstype, csname1))
         {
             String myText = " try { var ajaxPanel1 = $find('" + ajaxPanelReal.ClientID + "');  if (ajaxPanel1 != null && ajaxPanel1.ajaxRequest) { ajaxPanel1.ajaxRequest('myInit'); } else { $create(Telerik.Web.UI.RadAjaxPanel, { 'clientEvents': { OnRequestStart: '', OnResponseEnd: '' }, 'enableAJAX': true, 'enableHistory': false, 'links': [], 'loadingPanelID': '', 'styles': [], 'uniqueID': 'ctl00$ContentPlaceHolder1$ajaxPanelReal' }, null, null, $get('ctl00_ContentPlaceHolder1_ajaxPanelReal')); ajaxPanel1 = $find('" + ajaxPanelReal.ClientID + "'); ajaxPanel1.ajaxRequest('myInit'); } } catch (e) { alert(e); }";
         cs.RegisterStartupScript(cstype, csname1, myText, true);
         }
     }

}

Notify: The alert in catch-block is just while testing.
The "InitialLoadCompletePart1" is a static bool var which the Page_Load event set to false on !Page.IsPostBack.

protected void ajaxPanelReal_AjaxRequest(object sender, AjaxRequestEventArgs e)
{
    if (e.Argument == "myInit")
    {
        InitialLoadCompletedPart1 = true;

        InitializeListBox(); //here the data will be load from db and listitems were added to listbox
    }
}

All works fine now.

But the scenario of my project wants to start 2 ajax requests on load. It is no problem to integrate that in existing code and call 2 Initialize methods instead of the one you see in code example. But we want to display every control (ListBox and div with RadGrid and RadChart) as soon as it was loaded completly. Notice please that the ListBox load takes 10 seconds and the grid/ chart load takes a minimum of 30 seconds. We want to make it possible to show ListBox update while the ajax request from grid&chart is still loading.

I tried to start 2 ajax requests but only one (the second) hits the "ajaxPanelReal_AjaxRequest()" method.
I although tested the attribute "RequestQueueSize" (set 2 and greater) -> No effect...

Have you any idea to solve this "simultan ajax request" problem?

Vielen Dank
Marco

[Iana Tsolova]

Hello Marco,

The code you implemented in code behind, can be done with javascript if you use the previously mentioned pageLoad client-side event handler of the pageRequestManager. You can check this article for a sample.
However as you already found, you cannot have two simultaneuos ajax requests. You can have only subsequent requsts which is either achieved with the RequestQueueSize property of the RadAjax control. Or you can handle the RadAjax control OnResponseEnd event, and when the first request finishes, invoke the second one.

Regards,
Iana
the Telerik team

[mpoi]

Hi Lana,

thanks for support!

I improved my implementation as you posted with the javascript "pageLoad" (and RadAjaxManager instead of the panel). It works fine now without register any scripts in code behind. Thats better.

There are only subsequent ajax requests. I just wondering why everybody name this 'simultaneuos'.
The better word for this is ajax request queue... (As it is named by telerik :-) )

I only have to think more subsequently ;-)

Tanks a lot
Marco