create your own

Automatic Refresh data on page using AJAX UpdatePanel

72
rate or flag this page

By fatma78


I am explaining how we can automatic refresh data on an ASP.NET page after a certain interval using AJAX UpdatePanel and other controls. I am using some Ajax controls and using SQL server database and Data Grid control. Database name is north wind. In this application my interval time for refresh data is 60 second. We can change your time by times interval property.

//This code for display data in the datagrid:

public void DisplayData()

{

System.Data.SqlClient.SqlConnection = new System.Data.SqlClient.SqlConnection("Initial Catalog=Northwind; Data Source=localhost; Uid=sa; pwd=;");

System.Data.SqlClient.SqlDataAdapter ds = new System.Data.SqlClient.SqlDataAdapter("select * from Employees", cn);

DataSet ds = new DataSet();

da.Fill(ds);

myGrid.DataSource = ds;

myGrid.DataBind();

}

protected void Page_Load(object sender, EventArgs e)

{

//You can check your current time on page load. Write this code:

lblTime.Text = System.DateTime.Now.ToString();

DisplayData();

}

protected void Timer1_Tick(object sender, EventArgs e)

{

//Datagrid refresh time

lbldgTime.Text = "Refresh at:" + System.DateTime.Now.ToString();

DisplayData();

}

//This is HTML Code:

<form id="form1" runat="server">

<asp:Label ID="Label2" runat="server" Text="This is Time, When The Full Page Load :" Font-Bold="true"></asp:Label>&nbsp;

<asp:Label ID="lblTime" runat="server"></asp:Label><br /><br />

<asp:ScriptManager ID="ScriptManager1" runat="server" />

<div>

<asp:Timer ID="Timer1" OnTick="Timer1_Tick" runat="server" Interval="30000">

</asp:Timer>

</div>

<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="server">

<Triggers>

<asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />

</Triggers>

<ContentTemplate>

<asp:Label ID="Label3" runat="server" Text="This is The Time when Only Data Grid will Referesh :" Font-Bold="true"></asp:Label>&nbsp;

<asp:Label ID="lbldgTime" runat="server" Text="Grid not refreshed yet."></asp:Label><br />

<asp:Label ID="Label4" runat="server" Text="(Grid Will Referesh after Every 60 Sec)" Font-Bold="True"></asp:Label>&nbsp;

<br /><br />

<asp:DataGrid ID=myGrid runat="server" Width="100%" GridLines="Both" HeaderStyle-BackColor="#999999" AutoGenerateColumns="false">

<Columns>

<asp:BoundColumn DataField="EmployeeID" HeaderText="Employee ID"></asp:BoundColumn>

<asp:BoundColumn DataField="FirstName" HeaderText="First Name"></asp:BoundColumn>

<asp:BoundColumn DataField="LastName" HeaderText="Last Name"></asp:BoundColumn>

<asp:BoundColumn DataField="City" HeaderText="City"></asp:BoundColumn>

</Columns>

<HeaderStyle BackColor="#999999" />

</asp:DataGrid>

</ContentTemplate>

</asp:UpdatePanel>

</form>

I hope this code example will be useful

Print   —   Rate it:  up  down  flag this hub

Comments

RSS for comments on this Hub

No comments yet.

Submit a Comment

Members and Guests

Sign in or sign up and post using a hubpages account.


optional


  • No HTML is allowed in comments, but URLs will be hyperlinked
  • Comments are not for promoting your hubs or other sites

working