Loading another page into DIV and refreshing every 5 seconds - javascript

I am using the below to load a form into a div.
<script>
$("#TheForm").load("Form.php");
</script>
How can I amend this script to load the content (refresh it) every 5 seconds?

You can use setInterval, Like this:
$("#TheForm").load("Form.php"); // For first time
setInterval(() => {
$("#TheForm").load("Form.php");
}, 5000);

Related

How to auto refresh webpage all controls in given time interval

I am looking for auto refresh the webpage and load the pervious data while loading the page.
current with button click I can refresh the data without any time limit , but I need it automatically with given time.
Add this JavaScript to your page:
It refreshs the page every 5 Seconds
<script>
setTimeout(function(){
window.location.reload(1);
}, 5000);
</script>
Or if you like to click the button with jquery every 5 Seconds:
<button id="IdOfButton" >Click me </button>
<script>
setInterval(function(){
$('#IdOfButton').trigger('click');
}, 5000);
</script>

javascript / html auto refresh button

I would like to build a webpage button which if clicked reloads the webpage every x seconds (i.e. 5 seconds = 5000 ms). The Problem is that my function gets executed once after 5 seconds, but wont continue to auto refresh after the button was clicked. It always waits for the next button click.
In theory I know that after the click my function has to be called every x seconds, but I simply don't know how to implement this.
This is how far i got:
<html>
<head>
</head>
<body>
<button id = "btn-reload">Automatischer Reload der Seite</button>
<script>
const btnReload = document.getElementById("btn-reload");
btnReload.addEventListener("click", function(){
setInterval(function(){
location.reload()}, 5000);
});
</script>
</body>
</html>
While you refreshing page all state is cleared so also interval not exist. To make it work you need something which will save the state between refresh for example local storage: https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage
You can use URL as your flag if auto refresh is enabled.
Example your-url.com?autorefresh=true
on window load check this flag is set or not to run your auto refresh feature

How to reload a page using javascript after the whole page is loaded

I want to reload a page after the whole PHP script is loaded, and printed the result. Yeah, i want an infinite loop
This is the script
setTimeout(function(){
window.location.reload(1);
}, 5000);
You can use window.location.reload function to load page. If you need to reload after page completed, use window.onload event. (reload function has one parameter that can disable cache.)
window.onload = function(){ window.location.reload()} //reload with using browser cache
window.onload = function(){ window.location.reload(true)} //reload without using browser cache
Another way is sending refresh header to browser by set refresh header in php:
<?php
header("refresh:5"); //loaded page reload after 5 seconds
?>

How to delay a page refresh in javascript?

I want to refresh a web page using javascript but when any event occur after few second the page will refresh.
what can i do?
You can try setTimeout()
setTimeout(function() {
// Do something after 5 seconds
location.reload();//reload page
}, 5000);
Use meta tag like <meta http-equiv="Refresh" content="300">
This wiil make your page to refresh every 5minutes (5*60)

Refresh Page for interval using js

How can i refresh a page for every one minute using javascript.
Note: I don't have control/option to edit HTML body tag (where we usually call onload function).
Just insert this code anywhere in the page:
<script type="text/javascript">
setTimeout(function(){
location = ''
},60000)
</script>
<script type="text/javascript">
setTimeout(function () {
location.reload();
}, 60 * 1000);
</script>
setTimeout will reload the page after a specified number of milliseconds, hence 60 * 1000 = 1m. Also, since the page is being refreshed, the timeout will always be set on page load.
You do not need to have the code in the body tag. Just add this snippet below and it should work no matter where it is in the page.
<script type="text/javascript">
setInterval('window.location.reload()', 60000);
</script>
As long as you can access the HTML some where and your editor doesn't filter out tags you should be fine. If your editor has a separate area for JavaScript code then just enter setInterval line. :)
Here's the thing mate!
(Point 4 is for this particular question)
1). If you want to reload the same windows over and over again then just execute
window.location.reload()
2). If you want to hard reload from the server then execute
window.location.reload(true)
(basically, just pass true as a boolean arg to the same line of code)
3). If you want to do the same job as point 1 and 2 with a time out. i.e. execute the reload after some time JUST ONCE, then execute
setTimeout("window.location.reload()",10000);
(this should execute on the window after 10 sec. JUST ONCE)
4). If you want to keep reloading the window with a certain timeout then execute
setInterval("window.location.reload()",10000);
(this should execute on the window after 10 sec. with 10 sec. for the interval)
Surely,there're many ways to pass a callback..
setInterval(function(){window.location.reload();},10000);
or
<code>
function call1(){
location.reload(true);
}
setInterval(call1,10000);
</code>
Note:
-Have a look at MDN Guides for [setTimeout][1] and [setInterval][2] functions.
-Using the window object is optional but good to be used. (window is a global object and already available to your current window.)
If you don't want to edit the page, here's the trick. Open the console and write the below-mentioned snippet.
INTERVAL = 5 // seconds
STOP_AFTER = 15 // seconds
// Open the same link in the new tab
win1 = window.open(location.href);
// At every 5 seconds, reload the page
timer1 = setInterval(() => {
win1.location.reload();
console.log("Refreshed");
},INTERVAL*1000)
// Stop reloading after 15 seconds
setTimeout(() => clearInterval(timer1), STOP_AFTER*1000)
Since you want to reload it, you can not simply write location.reload() since the console will be cleared once it is reloaded.
Therefore, it will open a new tab with the same link. It will be easily able to control the 2nd tab using the console of the 1st tab.
When your URL has parameters, it seems that using location = '' doesn't work in IE8. The page reloads without any parameters.
The following code works for me :
<script type="text/javascript">
setTimeout(function(){
window.location.href = window.location.href;
},10000)
</script>

Categories

Resources