RadAjaxLoadingPanel only firing once after entering page.

[Aaron]

I have the following RadAjaxLoadingPanel that I am using to show a loading image when doing a search.

 

<asp:Panel ID="PanelUpdateProgress" runat="server">

 

 

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" MinDisplayTime="2000" >

 

 

<div class="divloadingbackground" id="divTitle2" runat="server">

 

 

<div class="divloading">

 

 

<div id="Img1" class="imageloading" />

 

 

<asp:Label ID="LabelLoadingText" CssClass="labelloading" runat="server" Text="Loading Data..."></asp:Label>

 

 

</div>

 

 

</div>

 

 

 

</telerik:RadAjaxLoadingPanel>

 

 

 

<telerik:RadAjaxManagerProxy ID="AjaxManagerProxy1" runat="server">

 

 

<AjaxSettings>

 

 

<telerik:AjaxSetting AjaxControlID="buttonSearch">

 

 

<UpdatedControls>

 

 

<telerik:AjaxUpdatedControl ControlID="divTitle2" LoadingPanelID="RadAjaxLoadingPanel1" />

 

 

</UpdatedControls>

 

 

</telerik:AjaxSetting>

 

 

</AjaxSettings>

 

 

</telerik:RadAjaxManagerProxy>

 

 

 

</asp:Panel>


When I first come into the page and click the search button(buttonSearch), which is included in a separate div not shown here with other code, the loading image comes up covering the whole page just as I would like.  However, when I do additional searches without leaving the page, the search itself executes, but the loading image does not come back up.  Am I missing a property that must be set in order to have the loading image come up again.

Thanks for any help that anyone may have.

Aaron

 

[Mira]

Hello Aaron,

I suggest that you to review the AJAX Manager help topic to see how to set the relationship between ajaxified and updated controls. In your case you should not update the RadLoadingPanel but the div containing the results from the search for example.

For making a RadAjaxLoadingPanel span over the whole page I recommend that you take a look at this code library.

Give it a try and let us know if you have any further problems.

All the best,
Mira
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Aaron]

Thank you Mira for your reply.  I actually tried to use the div that holds my search results before I tried it this way, but whenever the page would load I would get the following error: The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).

I thought since it did work, except on postback, the way I discussed in my post it would be easier to fix then when I got the above error.  Do you know of a way to fix the 'Controls collection cannot be modified....' error?  If there is a way to do that then I will use that. 

I also tried to use the example that you directed me to and I got the Controls collection error there as well when I tried to get it to work within my page.   The example would work by itself, but just not when I applied it to my page.

 I also noticed that when I changed the controls in the radajax_classic page from the Namespace="Telerik.Webcontrols" to the controls used in the Namespace="Telerik.Web.UI", then i got the 'Controls collection' error there as well.  So I was wondering if this an error that was in the newer release that might be fixed soon?  Maybe I am reaching a bit on that, but I am just trying to look at every angle so I can get this to work.

Thanks again for your help.

Aaron

[Aaron]

I figured out that the reason i was getting the error dealing with the controls collection was because I didn't have all of my javascript wrapped in a RadCodeBlock, for my page and the example given.  In my page I did have a RadCodeBlock with a majority of my javascript inside of it, when I did put all of the javascript inside of it, I didn't get a compilation error, but when I did my search I got numerous null object errors and my grid would not come up.  How do I know what should go inside of the CodeBlock, is there a rule that I should go by?   I will take a look and see if I can find something on that. 

Thanks again for your help.

Aaron

[Aaron]

I was able to fix my problem by doing a couple of things. The first thing I did, in my javascript I changed from getting the client id by using a

document.getElementById(

"<%=textbox.ClientID %>"), to passing in the client id into the function.  I also changed the ControlID in the <telerik:AjaxUpdatedControl to a div that is actually a div just above my results div that has much less content in it then my results div, which eliminate the not null errors.  Probably not exactly the ideal situation, but it works and works on more than just the first postback.

Thank you for your help.

Aaron