Wednesday, March 21, 2012

Delay content loading using ajax in Custom control?

Hi All

I Want to Delay content loading using ajax if the running controls are taking so much time in Custom control. I did this in WebPage but i have no idea about how it should be done in an Custom control. The data in custom control is coming from webservice which is taking long time, in the mean while i want to display an image saying "loading..." for it using ajax. Can anyone plz help me out.

Thanks in Advance,

Thanks & Regards,

Rajak Shaik.

Hi

I assume that you are not familiar with the AJAX UpdateProgress control.

Please find this link to see a demo and sample code. You can do it exactly what you wanted to do with this.

http://www.asp.net/AJAX/Documentation/Live/tutorials/UpdateProgressTutorials.aspx


hello.

well, that won't help him.

even though i don't agree there are some guys that are doing something like this:

1. wrap the part that has the user control with an updatepanel

2. don't make the call for loading the data when the user controlo is loaded for the 1st time

3. when the page loads on the client, they refresh the updatepanel (if you have an updateprogress, it'll kick in automatically in this case)

4. during a partial postback, you can perform the call

notice that I'm against this approach, since i believe that ajax programming should envolve mainly client side programming...


Hi,

This question has been discussed athttp://www.codeproject.com/Ajax/DelayedContentLoading.asp &http://forums.asp.net/t/1127147.aspx

Please check out these links to get some idea,

Best Regards,


Hi All,

Thanking u all for replying. I able to do this using UpdateProgress, and Script. Actually my requirement was little bit changed, i.e. i was asked to Delay content loading in case of UserControl, which is having Custom controls init. Whenever an event of Usercontrol fired then i need to display this image 'loading..." until the data comes. So i have written the code below on the webpage(which is having this Usercontrol in it).

<asp:UpdatePanelID="UpdatePanel1"runat="server">

<ContentTemplate>

<uc1:PropertiesID="usrDestination"runat="server"PageUri=""ParentUri=""/>

</ContentTemplate>

</asp:UpdatePanel>

<asp:UpdateProgressID="UpdateProgress1"AssociatedUpdatePanelID="UpdatePanel1"runat="server">

<ProgressTemplate>

<asp:imagerunat="server"ID="image2"ImageAlign="middle"ImageUrl="spinner.gif"/>

<asp:Labelrunat="Server"ID="label2"Font-Size="smaller"ForeColor="orange"Text="Loading..."/>

</ProgressTemplate>

//Script in the Body

<scripttype="text/javascript">

Sys.Application.add_load(ApplicationLoadHandler);

function ApplicationLoadHandler(sender, args)

{

var prm = Sys.WebForms.PageRequestManager.getInstance();

prm.add_initializeRequest(initRequest);

prm.add_endRequest(endRequest);

}

function initRequest(sender, args)

{

$get('UpdateProgress1').style.display ='block';

}

function endRequest(sender, args)

{

$get('UpdateProgress1').style.display ='none';

}

</script>

This is Working fine for me. I would be happy if this code helps to anyone that is in need. Thank u once again for u all for helping me in finding out the solution for this problem.

Thanks & Regards,

Rajak Shaik.

No comments:

Post a Comment