Automatically update table

Question

I have a PHP script render a beautiful series of div elements from MySQL info, now I want it to update dynamically and add new divs as new fields in MySQL are added.

window.setInterval(function() {

         $.get('tableup.php', function(balance) {
             $('.containerDiv').html(balance);
         });

    }, 60000*0.1);

First question is how do I add the divs to the top of the container div with a fade effect? Second question is how do I know which divs to return in tableup.php? I already have the dates of every field saved, would passing them to the tableup, parsing them, then running a proper query on the database work? How do I save the date client side? The format is like this 2012-11-17 13:26:31

Re: the first question, http://stackoverflow.com/q/1520178/139010 — Matt Ball, Nov 18 '12 at 15:46

score 1 · Accepted Answer · answered Nov 18 '12 at 16:23

1

Question 1:

Use something like

$('.containerDiv').prepend(balance).fadeIn('slow');

Be sure to set the "incoming" div's as display: none in your css, so you don't see a flash.

Question 2:

Sure, save the date as timestamp or in your format in a variable and just pass it to the script

var time = '2012-11-17 13:26:31';

window.setInterval(function() {

         $.get('tableup.php', { lastTime: time }, function(balance) {
             $('.containerDiv').html(balance);
             //update time, either from server script or by using the client side time
         });

    }, 60000*0.1);

answered Nov 18 '12 at 16:23

David Müller

5,093
2
23
33

What if I have a div with the id "timestamp" whose value equals to the latest date, how do I set the var to that value? – Max0999 Nov 18 '12 at 16:53
1

If you use jQuery, the best way of doing this would be `$("#myDiv").data("timestamp", myTimeStamp)` - this way, you have no visible markup on the page. – David Müller Nov 18 '12 at 16:55
`var time = document.getElementById('timestamp').value; $.get('tableup.php', { lastTime: time }, function(html) {` this part doesn't work for some reason, if I use lastTime: "testvalue" it works. – Max0999 Nov 18 '12 at 18:56
is the element with the id timestamp really an input field / hidden field? What does `console.log(time)` reveal? – David Müller Nov 18 '12 at 21:02

Automatically update table

1 Answers1