Sunday, 26 November 2017

ASP.Net Ajax with multiple Update Panel and Update Progress Control with multiple gif images


UpdtProgress.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="UpdtProgress.aspx.cs" Inherits="UpdtProgress" %>
<!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 runat="server">
    <title>Untitled Page</title>
    <style type="text/css">
        .style1
        {
            width: 100%;
        }
        .style2
        {
            height: 24px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table bgcolor="Silver" class="style1">
            <tr>
                <td>
                    <asp:ScriptManager ID="ScriptManager1" runat="server">
                    </asp:ScriptManager>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:UpdateProgress ID="UpdateProgress2" runat="server"
                        AssociatedUpdatePanelID="UpdatePanel2">
                        <ProgressTemplate>
                        <strong>
                        Work Progress.......
                        </strong>
                            <img src="Images/flash_loader.gif" runat="server" />
                        </ProgressTemplate>
                    </asp:UpdateProgress>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                        <ContentTemplate>
                            <asp:Label ID="lblMsg2" runat="server" Font-Bold="True" ForeColor="Maroon"></asp:Label>
                            <asp:Button ID="btnProgress2" runat="server" BackColor="#CCCCCC" Font-Bold="True"
                                ForeColor="Blue" Text="UpdateDate" onclick="btnProgress2_Click" />
                        </ContentTemplate>
                    </asp:UpdatePanel>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:UpdateProgress ID="UpdateProgress1" runat="server"
                        AssociatedUpdatePanelID="UpdatePanel1">
                        <ProgressTemplate>
                            <img src="Images/flash_loader.gif" runat="server" />
                        </ProgressTemplate>
                    </asp:UpdateProgress>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                        <ContentTemplate>
                            <asp:Label ID="lblMsg" runat="server" Font-Bold="True" ForeColor="Maroon"></asp:Label>
                            <asp:Button ID="btnProgress" runat="server" BackColor="#CCCCCC" Font-Bold="True"
                                ForeColor="Blue" Text="UpdateDate" OnClick="btnProgress_Click" />
                        </ContentTemplate>
                    </asp:UpdatePanel>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:UpdateProgress ID="UpdateProgress3" runat="server"
                        AssociatedUpdatePanelID="UpdatePanel3">
                        <ProgressTemplate>
                            <asp:Image ID="Image1" runat="server" ImageUrl="~/Images/Loading.gif" />
                        </ProgressTemplate>
                    </asp:UpdateProgress>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:UpdatePanel ID="UpdatePanel3" runat="server">
                        <ContentTemplate>
                            <asp:Label ID="lblMsg3" runat="server" Font-Bold="True" ForeColor="Maroon"
                                Text="DateTime"></asp:Label>
                            <asp:Button ID="Button2" runat="server" Font-Bold="True" ForeColor="Blue"
                                onclick="Button2_Click" Text="UpdateDate" />
                        </ContentTemplate>
                    </asp:UpdatePanel>
                </td>
            </tr>
            <tr>
                <td class="style2">
                    <asp:UpdateProgress ID="UpdateProgress4" runat="server"
                        AssociatedUpdatePanelID="UpdatePanel4">
                        <ProgressTemplate>
                            <asp:Image ID="Image2" runat="server"
                                ImageUrl="~/Images/progressAnimation.gif" />
                        </ProgressTemplate>
                    </asp:UpdateProgress>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:UpdatePanel ID="UpdatePanel4" runat="server">
                        <ContentTemplate>
                            <asp:Label ID="lblMsg4" runat="server" Font-Bold="True" ForeColor="Maroon"
                                Text="DateTime"></asp:Label>
                            <asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/Images/next.gif"
                                onclick="ImageButton1_Click1" />
                        </ContentTemplate>
                    </asp:UpdatePanel>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:UpdateProgress ID="UpdateProgress5" runat="server"
                        AssociatedUpdatePanelID="UpdatePanel5">
                        <ProgressTemplate>
                            <asp:Image ID="Image3" runat="server"
                                ImageUrl="~/Images/LoadingProgressBar.gif" />
                        </ProgressTemplate>
                    </asp:UpdateProgress>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:UpdatePanel ID="UpdatePanel5" runat="server">
                        <ContentTemplate>
                            <asp:Label ID="lblMsg5" runat="server" Font-Bold="True" ForeColor="Maroon"
                                Text="DateTime"></asp:Label>
                            <asp:ImageButton ID="ImageButton2" runat="server" ImageUrl="~/Images/reply.gif"
                                onclick="ImageButton2_Click" />
                        </ContentTemplate>
                    </asp:UpdatePanel>
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>

UpdtProgress.aspx.cs
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;

public partial class UpdtProgress : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
    }
    protected void btnProgress_Click(object sender, EventArgs e)
    {
        //Introducing delay Demonstration
        System.Threading.Thread.Sleep(3000);
        lblMsg.Text = "This button was clicked on..." + DateTime.Now.ToString();
    }
    protected void btnProgress2_Click(object sender, EventArgs e)
    {
        //Introducing delay Demonstration
        System.Threading.Thread.Sleep(4000);
        lblMsg2.Text = "This button was clicked on..." + DateTime.Now.ToString();
    }
    protected void Button2_Click(object sender, EventArgs e)
    {
        //Introducing delay Demonstration
        System.Threading.Thread.Sleep(5000);
        lblMsg3.Text = "This button was clicked on..." + DateTime.Now.ToString();
    }
    protected void ImageButton1_Click1(object sender, ImageClickEventArgs e)
    {
        //Introducing delay Demonstration
        System.Threading.Thread.Sleep(6000);
        lblMsg4.Text = "This button was clicked on..." + DateTime.Now.ToLongDateString();
    }
    protected void ImageButton2_Click(object sender, ImageClickEventArgs e)
    {
        //Introducing delay Demonstration
        System.Threading.Thread.Sleep(6000);
        lblMsg5.Text = "This button was clicked on..." + DateTime.Now.ToLongDateString();
    }
}

0 comments

Post a Comment