Javascript reload page real-time results

Question

I know i can use javascript to refresh the page after a certain amount of time;

<html>
<head>
<script type="text/JavaScript">
<!--
function timedRefresh(timeoutPeriod) {
    setTimeout("location.reload(true);",timeoutPeriod);
}
//   -->
</script>
</head>
<body onload="JavaScript:timedRefresh(5000);">
</body>
</html>

Is it possible to reload the page once a new field has been added/updated in the database to display data in real-time instead of "F5"

You mean you can't find out to refresh a page with javascript *anywhere* on Google? — John Conde, Mar 27 '13 at 17:45
possible duplicate of [how to refresh a page using javascript?](http://stackoverflow.com/questions/5294842/how-to-refresh-a-page-using-javascript) — D'Arcy Rittich, Mar 27 '13 at 17:47
possible duplicate of [Page auto reload with parameters](http://stackoverflow.com/questions/296685/page-auto-reload-with-parameters) — mplungjan, Mar 27 '13 at 17:48
Please do not update your question with horrible code we all hate — mplungjan, Mar 27 '13 at 17:57
As you can probably tell by the question, im not familiar with javascript or ajax, so posting this question was to ask for help, not be criticized for asking a "dumb question". — S H, Mar 27 '13 at 18:00
I did not tell you that. However at SO a minimum of research is expected and it is not possible to not have found anything on the net by simply googling for "update html after database insert" — mplungjan, Mar 27 '13 at 18:08
i havent used any html in my script, its PHP as you'll see here http://stackoverflow.com/questions/15658441/issues-with-datetime-in-database — S H, Mar 27 '13 at 18:12
To the browser its html. @mplungjan mentioned that search because performing a page refresh is insanely costly when all you need to do pass in some small data and update the dom. — Ben Felda, Mar 27 '13 at 18:18
Are you inserting the data into the database or could someone else be? — Garrett, Mar 28 '13 at 17:17
If you are, then you could dynamically update the page view without refreshing the page. If you aren't, then you either could use a database trigger event to trigger the insert event, or you could use a polling mechanism (setTimeout/setInterval) on the front-end to read from the database. — Garrett, Mar 28 '13 at 17:19

score 0 · Answer 1 · edited May 23 '17 at 12:28

0

You can setup insert and update triggers to send an event that would cause a callback to execute in the application. The application can then invoke a registered JS callback function. You can see a description here https://stackoverflow.com/a/812803/1418005

edited May 23 '17 at 12:28

Community

1
1

answered Mar 27 '13 at 18:08

Jerry Hoerig

146
9

score 0 · Answer 2 · edited May 23 '17 at 10:25

Invoke Notifications via MySQL Triggers on UPDATE, INSERT and DELETE

This works in most Databases and can be used to send server-sent events directly to the browser when something changes (such as when a field is updated and you need to notify the customer instantly).

Use Database Triggers and Server-Sent Event Notifications which sends event triggers directly to the browser with the following - Invoke pusher when mysql has changed for anything that changes on the database. This happens in Real-time for real-time results.

Garrett · Answer 3 · 2013-03-28T17:22:11.137

-1

You should not refresh the page after a certain amount of time, it is rather bothersome to the user. You should use a setInterval to send another request to the server to dynamically update the page.

http://www.w3schools.com/jsref/met_win_setinterval.asp

setInterval(fn, 5000);

function fn() {
  alert('???');
}

EDIT in Response: You could either use a database trigger event to trigger the insert event and then notify the client to read, or you could use a polling mechanism - query db every 60 seconds using (setTimeout/setInterval). This could be done using jQuery ajax or any other XHR mechanism.

For ex:

$.ajax({
  type: 'GET',
  url: 'server.php/GetPageData' // or GetPageUpdate
  data: {},
  success: function(data) {

  }
});

edited Mar 28 '13 at 17:22

answered Mar 27 '13 at 17:48

Garrett

1,658
2
17
29

1

Better [mdn setInterval](https://developer.mozilla.org/en-US/docs/DOM/window.setInterval) – mplungjan Mar 27 '13 at 17:51
Yes, this sounds more suited. Is it possible to refresh the page after a field has been inserted/updated? – S H Mar 27 '13 at 17:52

Javascript reload page real-time results

3 Answers3

Invoke Notifications via MySQL Triggers on UPDATE, INSERT and DELETE