ASP.Net 2.0 AJAX Update Progress Control

by top54u.com 28 Apr, 2008
Spotlight.....

Introduction

AJAX UpdateProgress Control provides a visual feedback to the user about the status of update or asynchronous postback progress. You can set the delay time for AJAX UpdateProgress control, that displays the UpdateProgress status message or any animated image placed inside the UpdateProgress control if partial-page postback is taking long time more than the delay time of AJAX UpdateProgress control to indicate the user about the status of progress of update.

 

Working with UpdateProgress Control and UpdatePanel Control

You can associate UpdateProgress control with UpdatePanel control to provide the status information about partial-page updates in AJAX UpdatePanel control.
You can bind multiple AJAX UpdateProgress controls with their individually associated UpdatePanel controls to provide the visual feedback of progress to the user for each UpdatePanel control during partial-page postbacks.

You can also associate a single AJAX UpdateProgress control with multiple UpdatePanel controls on the ASP.Net page.
UpdateProgress control renders the DIV element of HTML that becomes visible or hidden according to the state of associated UpdatePanel control when it causes asynchronous postback.

 

Example Code for AJAX UpdateProgress Control

Before learning from UpdateProgress Control Example Code let’s see the properties of UpdateProgress Control such as AssociatedUpdatePanelID, Delay.

AssociatedUpdatePanelID: Set the Associated UpdatePanel ID in this property of UpdateProgress Control to display the status message for particular that UpdatePanel Control update progress.

Delay: Set the delay time in milliseconds (1000 = 1 second, Default value = 500). Delay time display the UpdateProgress after this time delay of UpdatePanel progress.

 

HTML Code for AJAX UpdateProgress Control in ASP.Net

 

    <form id="form1" runat="server">
        <div>
            <asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>
            <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
                <ProgressTemplate>
                    <asp:Label ID="Label1" runat="server" Text="Loading...."></asp:Label>
                </ProgressTemplate>
            </asp:UpdateProgress>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>
                    <asp:Label ID="Label2" runat="server"></asp:Label>
                    <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Update" />
                </ContentTemplate>
            </asp:UpdatePanel>
        </div>
    </form>

 

C# code for AJAX UpdateProgress Control

[code:c#] 

    protected void Button1_Click(object sender, EventArgs e)
    {
        System.Threading.Thread.Sleep(3000);
        Label2.Text = DateTime.Now.ToString();
    }

 [/code]

System.Threading.Thread.Sleep function is used to set the delay in updating the content of Label2 placed inside the UpdatePanel Control so that UpdateProgress display the status message after default delay time. But you don’ t need to set this intentionally given delay in Thread.

Spotlight.....

Be the first to rate this post

  • Currently 0/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5

Tags: , , , , , , ,

Add comment


(Will show your Gravatar icon)  

  Country flag

[b][/b] - [i][/i] - [u][/u]- [quote][/quote]



Live preview

8/23/2008 8:48:05 PM

OUR SPONSORS[+ advertise here]
related videos.....
recent posts.....
top54u ezines.....