Hi,
I have the some php/mysql queries that pull data from my database and then echo out json_encode($rows);. In turn I display the data in my divs from JSON array's. My query is, I am trying to work out how to incorporate the an auto refresh on each of the div id tags, pulling fresh data from my json_data.php file without having my whole front end index.html page refresh. I've been looking around and found something like this:
$('#objectInfo').html(content);
setTimeout('updateStatus()',1000);
$(document).ready(updateStatus);But I am not sure how to implement it. Here's my code below:
<html>
<head>
<script type="text/javascript">
$("document").ready(function () {
$.getJSON('json_data.php?update=AFL', function (data) {
$("#SportsAFL").html('');
$.each(data, function (i, data) {
$("#SportsAFL").append('<tr><td>'+data.comments_id+'</td><td>'+data.comments_time+'</td><td>'+data.comments_date+'</td></tr>');
});
});
$("#SportsAFL").fadeIn(500);
$.getJSON('json_data.php?update=NFL', function (data) {
$("#SportsNFL").html('');
$.each(data, function (i, data) {
$("#SportsNFL").append('<tr><td>'+data.ss_id+'</td><td>'+data.ss_timestart+'</td><td>'+data.ss_datestart+'</td></tr>');
});
});
$("#SportsNFL").fadeIn(500);
$.getJSON('json_data.php?update=BLAH', function (data) {
$("#SportsBLAH").html('');
$.each(data, function (i, data) {
$("#SportsBLAH").append('<tr><td>'+data.jobs_id+'</td><td>'+data.jobs_datetype+'</td><td>'+data.jobs_datestart+'</td></tr>');
});
});
$("#SportsBLAH").fadeIn(500);
});
</script>
</head>
<body>
<table>
<div id="SportsAFL"></div>
</table>
<br>
<table>
<div id="SportsNFL"></div>
</table>
<br>
<table>
<div id="SportsBLAH"></div>
</table>
</body>
</html>