How to get realtime data from database using jQuery every 1 second

Question

How to get realtime data from mySQL database using jQuery every One second

i need change document.write so i see result in new page

<SCRIPT>
            setTimeout("document.write('<p><?php
        $qry = mysql_query('SELECT SUM(clicks) AS total FROM short_urls');
        $row = mysql_fetch_assoc($qry);
        echo number_format($row['total']); ?></p>')",1000);
</SCRIPT>

Please, make sure you really understand why the code above is a total nonsense. You except the browser to run code that is designed to run on your server. — Dercsár, Jan 20 '11 at 14:02

score 4 · Accepted Answer · edited May 23 '17 at 12:23

A simple strategy is to use setTimeout:

setTimeout( function(){
  your_function_that_gets_data();
  your_function_that_displays_data();
}, 1000 );

For more sophisticated approaches, you might look into long polling.

Update: Anas, it looks like you went off the rails a bit after I suggested the above option. Whether you use setTimeout() or setInterval(), you certainly want to avoid the confusing mix with which you updated your question.

Make a php page that simply returns the total. Write your JavaScript to call that page asynchronously (i.e., via ajax), at whatever interval you like. When the result is returned, use a callback function to redraw the page region so the total is updated for the user.

Something like this:

var updateTotal = function () {
  $.get('your_script_that_returns_a_total.php', function( data ){ // get new total
    $('#div_displaying_total').val( data ); // paint a div with the new result
  });
};

Now you have a simple function that, when run, will update a div in your view with the current total. Run that function as frequently as you like. For example, to run it every five seconds:

var running = setInterval( updateTotal, 5000 );

You can of course get much fancier with timing, writing your updateTotal function to call itself after a delay, etc. And you can stop the updating like this:

clearInterval( running );

...which allows you to easily set up an on/off switch.

If any of this leads to greater clarity, I'd suggest updating your question, which is attracting downvotes for the muddled code therein.

You might also want to consider setInterval(). It repeats it automatically. And to prevent to many requests at a time you should put a setTimeout at the end of the return of each request. — Eric, Jan 13 '11 at 23:27
How is this code for streamlining, I mean will this clog up my server requests ? — MarkP, Jan 02 '16 at 02:47

score 2 · Answer 2 · answered Jan 08 '11 at 16:42

2

You will have to use PHP to make a call to the database to read all the rows out of it. The PHP would be called by an AJAX event set using a JavaScript setTimeout() function for every 1000ms (1 second). The huuuuge issue I can see with this is if you have many users, a large database and lots of simultaneous logins, you will very quickly overload your server. I think submitting a request every 30 seconds or something would be better, maybe 10 at the least.

answered Jan 08 '11 at 16:42

Bojangles

99,427
50
170
208

thank you.. i will add this code in "About" page i think This will not hurt much because the number of visited this page a little – Abudayah Jan 08 '11 at 16:51
A nice idea, although just to be safe I'd only update at minimum every 10 seconds. – Bojangles Jan 08 '11 at 19:18

How to get realtime data from database using jQuery every 1 second

2 Answers2