Blog

UpdatePanel on Page Load [Answered]RSS

6 replies

Last post Mar 17, 2014 12:53 AM by dotnetzoom

‹ Previous Thread|Next Thread ›

Shortcuts

Related Links

- Reply
Yavuz B.
Member

7 Points

22 Posts

UpdatePanel on Page Load

Mar 14, 2014 07:45 AM|Yavuz B.|LINK

Hi,

i have a ScriptManager and an UpdatePanel on my Page. Inside the UpdatePanel i have an LiteralControl.

I need the following:

1. On Page Load i do a long running operation.

2. In this piece of time i need to show a progress/loading indicator only for this sections (the updatepanel)

3. when the operation completes, i want to hide the indicator and show the result WITHOUT reloading the page

I hope it was clear :)

thanks in advance

regards

Yavuz

A2H

All-Star

50471 Points

9785 Posts

Re: UpdatePanel on Page Load

Mar 14, 2014 07:54 AM|A2H|LINK

Hi,

You can take a look at the Ajax UpdateProgress Control

HTML Mark Up:

<asp:ScriptManager ID="ScriptManager2" runat="server" />
        <asp:UpdateProgress runat="server" ID="PageUpdateProgress">
            <ProgressTemplate>
                Please wait til the operation completes
                <%--You can add your loading image here--%>
                <img alt="progress" src="images/loading.gif" />
            </ProgressTemplate>
        </asp:UpdateProgress>
        <asp:UpdatePanel runat="server" ID="Panel">
            <ContentTemplate>
                <asp:Button runat="server" ID="UpdateButton" OnClick="UpdateButton_Click" Text="Update" />
            </ContentTemplate>
        </asp:UpdatePanel>

You can wrap your controls inside the updatepanel

Code Behind:

 Protected Sub UpdateButton_Click(sender As Object, e As EventArgs)
        System.Threading.Thread.Sleep(5000);
    End Sub

You can also check the below links for more details

Alternatively you can check the below link

3 Ways to show Update Progress in Asp.Net

Thanks,
Aje
My Blog | Dotnet Funda

- Reply
NareshP_Tech...
Member

290 Points

76 Posts
Re: UpdatePanel on Page Load

Mar 14, 2014 07:56 AM|NareshP_Techie|LINK
Yavuz B.
i need to show a progress/loading indicator only for this sections (the updatepanel)

You can use UpdateProgess control along with the Update panel
```
<asp:UpdateProgress ID="UpdateProgress1" AssociatedUpdatePanelID="UpdatePanel1" runat="server">
    <ProgressTemplate>
      UpdatePanel1 updating...
    </ProgressTemplate>
    </asp:UpdateProgress>
```
Hope it helps!
updatepanel
Naresh Podishetty
MCTS | About Me | Website(MS Dev Zone)
Don't forget to mark useful responses as Answer if they helped you towards a solution.
- Reply
Yavuz B.
Member

7 Points

22 Posts

Re: UpdatePanel on Page Load

Mar 14, 2014 08:05 AM|Yavuz B.|LINK

Thanks for the replies. But the problem is not the UpdateProgress, i know how to trigger such an Async via Button or other Control.

But when i need to load the data on page load, the pages gets visible after everythign is completed. But i want to have the page visible first complete and at the same time on page load i want to load the data in the background and show after its finished on the updatepanel.

updatepanel
- Reply
mrwww76
Member

31 Points

39 Posts

Re: UpdatePanel on Page Load

Mar 14, 2014 12:47 PM|mrwww76|LINK

Some suggestions:

Display the progress message on the previous page before calling the next page that has the onload event. In many cases, the previous page will remain displayed until the process page is ready to render in the browser.

Your other option could be to execute the long running process in a hidden iframe. When the readystate of the iframe is complete then you know you can remove the progress message from the parent window and display any results

updatepanel
- Reply
chetan.sarod...
All-Star

48393 Points

12161 Posts

Re: UpdatePanel on Page Load

Mar 16, 2014 11:37 PM|chetan.sarode|LINK

Refer this - http://encosia.com/easy-incremental-status-updates-for-long-requests/

Chetan Sarode
Team Lead, Product Development
Approva Systems Pvt Ltd, Pune, India.

dotnetzoom

Contributor

5590 Points

1297 Posts

Re: UpdatePanel on Page Load

Mar 17, 2014 12:53 AM|dotnetzoom|LINK

Yavuz B.
i want to have the page visible first complete and at the same time on page load i want to load the data in the background and show after its finished on the updatepanel.

Add a timer control to the page and execute the background process in the first tick event. So, page immediately loads the remaining content such as buttons, gridviews and other html. But, timer tick event will trigger loading the data in the background. Once the data is retrieved, timer can be disabled to prevent subsequent ticks

<form id="form1" runat="server">
    <asp:ScriptManager runat="server" ID="sc" />    
    <asp:UpdatePanel runat="server" ID="up1">
        <ContentTemplate>
            <asp:Timer ID="timer1" runat="server" Interval="300" OnTick="timer1_Tick"></asp:Timer>
            <asp:Label ID="contentLabel" runat="server">
                Please wait while data is being loaded.....
            </asp:Label>
        </ContentTemplate>
    </asp:UpdatePanel>
</form>

protected void timer1_Tick(object sender, EventArgs e)
{            
    timer1.Enabled = false;
    //background process
    Thread.Sleep(5000);            
    contentLabel.Text = "Loaded";
}

You can keep a spinning image in the content panel so that it will display until the content is refreshed. Try this approach and see if it works.

EDIT:

You can add UpdateProgress for the update panel containing Timer control. Progress bar will be displayed when timer tick event gets triggered. This will also give an indication to the user that data is being loaded.

‹ Previous Thread|Next Thread ›