ASP.NET Ajax UpdateProgress

By: Rajesh P.S.

The UpdateProgress control in ASP.NET plays a crucial role in providing status information regarding the progress of downloads that take place during partial-page rendering within an UpdatePanel. It offers the flexibility to include multiple UpdateProgress controls on a single page, with each control capable of being associated with a distinct UpdatePanel control. Alternatively, a single UpdateProgress control can be employed and associated with all UpdatePanel controls present on the page. The placement of the UpdateProgress control can be either inside or outside the UpdatePanel controls, depending on specific requirements.

UpdateProgress control

To illustrate the functionality of the UpdateProgress control, consider the following Asp.Net program. In this example, an UpdateProgress control is utilized to effectively manage the waiting period until the completion of a task. During this waiting time, a visually engaging .gif file is displayed as a waiting message to the user.

By incorporating the UpdateProgress control within an UpdatePanel, you can effectively communicate the progress of a task to the user. During the waiting period, the specified .gif file serves as a visual indicator, conveying the message that the operation is underway.

Default.aspx

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat="server"> <title>Untitled Page</title> </head> <body> <form id="form1" runat="server"> <div> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <asp:UpdateProgress ID="UpdateProgress1" runat="server"> <ProgressTemplate> <img alt="ajax-progress" src="https://net-informations.com/asp/ajax/img/ajax-progress.gif"></img> </ProgressTemplate> </asp:UpdateProgress> <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <asp:Label ID="Label1" runat="server" Text=""></asp:Label> <br /> <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" /> </ContentTemplate> </asp:UpdatePanel> </div> </form> </body> </html>

Full Source | C#

using System; using System.Web.UI; public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { } protected void Button1_Click(object sender, EventArgs e) { System.Threading.Thread.Sleep(5000); Label1.Text = "Server Time : " + DateTime.Now.ToString(); } }

Full Source | VB.NET

Partial Class _Default Inherits System.Web.UI.Page Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click System.Threading.Thread.Sleep(5000) Label1.Text = "Server Time : " & DateTime.Now.ToString() End Sub End Class

Conclusion

The UpdateProgress control in ASP.NET presents as a powerful tool that shows status information during both single-page and double-page rendering. Unlike traditional forms where a single UpdatePanel is responsible for handling all controls, the flexible nature of Ajax allows for multiple, separate controls that are each linked to a distinct UpdatePanel. By employing the UpdateProgress control, developers could elevate the user experience via real time information and live elements that are visually attractive such as gif files to present a progress as the waiting process goes on.

Next > ASP.NET Ajax Timer

Related Topics

More Related Topics.....