We often come across a scenario where we need to update part of a page. We can use IFrame to refresh part of a page.
We can achieve this using Ajax also but here I am discussing how we can achieve without using Ajax.
Step 1. Add a page in the project with name “MyPage.aspx”, copy and paste below code in the aspx page
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="MyPage.aspx.cs" Inherits="MyPage"%><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Refresh part of page</title> <metahttp-equiv="Refresh" content="5" /> </head><body> <form id="form1" runat="server"> <div> <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> </div> </form></body></html>
The below line of code in the head section of the above code will refresh the page after every 5 second.
<meta http-equiv="Refresh" content="5" />
Step 2: Put below bold and italic lines of code in the Page_Load method of MyPage.aspx page, this line will refresh the time on each refresh of the page.
protected void Page_Load(object sender, EventArgs e) { Label1.Text = "This Page has been refrested at " + DateTime.Now.ToString(); }
Step 3. Now add another page in the project with name “Refresh.aspx”, copy and paste below code in aspx page of Refresh.aspx.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Refresh.aspx.cs" Inherits="Refresh"%><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title></head><body>
<form id="form1" runat="server"> <asp:Label ID="Label1" runat="server" Text="" /> <div> <iframe id = "myFrame" src = "MyPage.aspx" frameborder = "0" style="width: 500px;height:100px"> </iframe> </div> </form></body></html>
I have added an IFrame to achieve the goal of part refresh of the page. I have added src property and set it to MyPage.aspx which I have created in step 1.
I have also put a label outside the iframe to show the Date and time when Refresh.aspx page will load.
Step 4: Copy and paste below bold line of code on Page_Load methodprotected void Page_Load(object sender,EventArgs e)
{ Label1.Text = DateTime.Now.ToString(); }
Now run Refresh.aspx page, you will notice that the time on the Refresh.aspx won’t change but the time on MyPage.aspx will change after every 5 seconds
Live Demo Like us if you find this post useful. Thanks!
Shibashish mohanty
Download Code
We can achieve this using Ajax also but here I am discussing how we can achieve without using Ajax.
Step 1. Add a page in the project with name “MyPage.aspx”, copy and paste below code in the aspx page
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="MyPage.aspx.cs" Inherits="MyPage"%><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Refresh part of page</title> <metahttp-equiv="Refresh" content="5" /> </head><body> <form id="form1" runat="server"> <div> <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> </div> </form></body></html>
The below line of code in the head section of the above code will refresh the page after every 5 second.
<meta http-equiv="Refresh" content="5" />
Step 2: Put below bold and italic lines of code in the Page_Load method of MyPage.aspx page, this line will refresh the time on each refresh of the page.
protected void Page_Load(object sender, EventArgs e) { Label1.Text = "This Page has been refrested at " + DateTime.Now.ToString(); }
Step 3. Now add another page in the project with name “Refresh.aspx”, copy and paste below code in aspx page of Refresh.aspx.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Refresh.aspx.cs" Inherits="Refresh"%><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title>Untitled Page</title></head><body>
<form id="form1" runat="server"> <asp:Label ID="Label1" runat="server" Text="" /> <div> <iframe id = "myFrame" src = "MyPage.aspx" frameborder = "0" style="width: 500px;height:100px"> </iframe> </div> </form></body></html>
I have added an IFrame to achieve the goal of part refresh of the page. I have added src property and set it to MyPage.aspx which I have created in step 1.
I have also put a label outside the iframe to show the Date and time when Refresh.aspx page will load.
Step 4: Copy and paste below bold line of code on Page_Load methodprotected void Page_Load(object sender,EventArgs e)
{ Label1.Text = DateTime.Now.ToString(); }
Now run Refresh.aspx page, you will notice that the time on the Refresh.aspx won’t change but the time on MyPage.aspx will change after every 5 seconds
Live Demo Like us if you find this post useful. Thanks!
Shibashish mohanty
Download Code
Comments
Post a Comment