PC & IT SUPPORT MADE EASY FORUM
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Refreshing page elaments

Go down

Refreshing page elaments Empty Refreshing page elaments

Post by jamied_uk 27th September 2011, 14:46

to refresh framesets

http://www.codingforums.com/showthread.php?t=9792


to refresh pages

http://www.techtricky.com/how-to-refresh-page-or-part-of-the-page-automatically/



Here I am going to show different methods to refresh/reload the page or part of the page automatically in certain period of time.

Simplest way to refresh whole page is by using meta tag as below:



Above code refreshes the page for every 30 seconds.

if you don’t want to use meta tag as some browsers won’t support, you can do this by using Javascript as below:


window.onload = setupRefresh;

function setupRefresh() {
setTimeout("refreshPage();", 30000); // milliseconds
}
function refreshPage() {
window.location = location.href;
}


Above code reloads the page for every 30 seconds.
setTimeout() allows you to specify that a piece of JavaScript code (called an expression) will be run a specified number of milliseconds from when the setTimeout() method was called. The general syntax of the method is:

setTimeout ( expression, timeout );



~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Best way of refreshing elemants

where expression is the JavaScript code to run after timeout milliseconds have elapsed.
Refreshing part of a page periodically
Using Frames

Divide the page using frames and load different pages in each frame as below:











In the above two parts, if you want to reload particular part of the page, then use the above meta tag or Javascript approach in frame source html page.
Or
You can use the frame “reload” function periodically in frameset page itself.




window.onload = setupRefresh;

function setupRefresh() {
setInterval("refreshFrame();", 1000);
}
function refreshFrame() {
parent.right_frame.location.reload();
}








In the above code, “right_frame” reloads every second.
setInterval() function is very closely related to setTimeout() – both have similar syntax:

setInterval ( expression, interval );

The important difference is that, whereas setTimeout() triggers expression only once, setInterval() keeps triggering expression again and again (unless you tell it to stop). You can stop setInterval() by calling method clearInterval().
Without Frames

We can reload the particular block of the page using Javascript. Here, I am going to explain this with display time on a page which reloads every second.





window.onload = startInterval;
function startInterval()
{
setInterval("startTime();",1000);
}

function startTime()
{
document.getElementById('time').innerHTML = Date();
}







Above code will display time with seconds on a page and refreshes div (id “time”) block every second to show the exact time.

If you are using a JQuery, then use the “load” function to load the page in div block.


window.onload = setupRefresh;
function setupRefresh()
{
setInterval("refreshBlock();",30000);
}

function refreshBlock()
{
$('#block1').load("index.html");
}







In the above code, index.html page loads every 30 seconds in div with id “block1″.
jamied_uk
jamied_uk
Admin

Posts : 2951
Join date : 2010-05-09
Age : 41
Location : UK

https://jnet.sytes.net

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum