connectseekers.com

Thursday, 5 June 2014

Asynchronous Page Loading In Asp.net Using UpdatePanel and Timer Control | Simple Asynchronous Page Load in ASP.NET

6/05/2014 - By Pranav Singh 0

In web  technology Ajax have played very important role. When we are developing asp.net application on that case we always want to refresh the part of the page without refreshing the complete page.
So for Ajax Microsoft have introduced AjaxControlToolKit.  UpdatePanel, Timer, ScriptManager are some of the Ajax controls provide in the AjaxControlToolKit.

So in this article  I will show how you can refresh the part of the page using updatepanel and the Timer control in your asP.net application.


Now for this article first we will create a new asp.net application and add UpdatePanel, Timer, ScriptManager are in your asp.net page. After adding the controls your page code will look as shown below:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AsynchronousPageLoad.aspx.cs" Inherits="ProjectDemo_Asp.et.AsynchronousPageLoad" %>

<!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>Asynchronous Page Loading In Asp.net Using UpdatePanel and Timer Control</title>
    <style type="text/css">
        .style1
        {
            width: 213px;
        }
        .style2
        {
            width: 174px;
        }
        .style3
        {
            width: 213px;
            text-align: center;
            font-weight: bold;
        }
        .style4
        {
            width: 174px;
            text-align: center;
            font-weight: bold;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:Timer ID="Timer1" runat="server" Interval="1000" ontick="Timer1_Tick">
        </asp:Timer>
    <table border="1">
    <tr>
        <td class="style4">Asynchronous Page Load</td>
        <td class="style3">Static Content</td>
    </tr>
    <tr>
        <td class="style2">
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>
                    <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
                </ContentTemplate>
                <Triggers>
                <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
                </Triggers>
            </asp:UpdatePanel>
        </td>
        <td class="style1">
            <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
        </td>
    </tr>
    </table>
    </div>
    </form>
</body>
</html>

Now in your .cs page add the below code.

C#.Net 
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace ProjectDemo_Asp.et
{
    public partial class AsynchronousPageLoad : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            Label2.Text = "Loading time.....";
            Label1.Text = DateTime.Now.ToShortTimeString();

        }

        protected void Timer1_Tick(object sender, EventArgs e)
        {
            Label2.Text = DateTime.Now.ToLongTimeString();
        }
    }
}

VB.Net 
Imports System
Imports System.Collections.Generic
Imports System.Linq
Imports System.Web
Imports System.Web.UI
Imports System.Web.UI.WebControls

Namespace ProjectDemo_Asp.et
    Partial Public Class AsynchronousPageLoad
        Inherits System.Web.UI.Page
        Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
            Label2.Text = "Loading time....."
            Label1.Text = DateTime.Now.ToShortTimeString()

        End Sub

        Protected Sub Timer1_Tick(ByVal sender As Object, ByVal e As EventArgs)
            Label2.Text = DateTime.Now.ToLongTimeString()
        End Sub
    End Class
End Namespace

In above code I have written to refresh the time after every second and rest of the page will not refresh.

Now view page in browser for output.

About the Author

We are the group of people who are expertise in different Microsoft technology like Asp.Net,MVC,C#.Net,VB.Net,Windows Application,WPF,jQuery,Javascript,HTML. This blog is designed to share the knowledge.

Get Updates

Subscribe to our e-mail newsletter to receive updates.

Share This Post

0 comments:

Please let me know your view

Free Ebooks


About Us

We are the group of people who are expertise in different Microsoft technology like Asp.Net,MVC,C#.Net,VB.Net,Windows Application,WPF,jQuery,Javascript,HTML. This blog is designed to share the knowledge.

Contact Us

For writing article in this website please send request by your

GMAIL ID: dotnetpools@gmail.com
Email Id : contact@aspdotnet-pools.com

Bugs and Suggestions

As we all know that this website is for sharing knowledge and providing proper solution. So while reading the article is you find any bug or if you have any suggestion please mail us at contact@aspdotnet-pools.com.

Partners


Top jQuery Plugins

Global Classified : Connectseekers.com
© 2014
back to top