ansaurus

Question

Simple Javascript MYSQL checking function

Answer 1

+1 A:

You need Ajax and setInterval.

Here is how SetInterval works http://www.elated.com/articles/javascript-timers-with-settimeout-and-setinterval/

SetInterval basically just tells the browser to call a javascript function every x milliseconds.

Here is a few Ajax Examples http://www.w3schools.com/Ajax/ajax%5Fexamples.asp

Ajax is basically a way for javascript to request a page and get its contents without reloading the page. In the example below it tries to create an xmlhttprequest for all the browsers (sadly it's done like this) and then sends in the request. We define state_change as the function to be called when we get a reply back. In this example it just takes the response and displays it, but you can do whatever you want with that.

Below is a modified example. It should work.

<html><head>
<script type="text/javascript">
var xmlhttp;
function loadPage()
{
xmlhttp=null;
if (window.XMLHttpRequest)
  {// code for IE7, Firefox, Opera, etc.
  xmlhttp=new XMLHttpRequest();
  }
else if (window.ActiveXObject)
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
if (xmlhttp!=null)
  {
  xmlhttp.onreadystatechange=state_Change;
  xmlhttp.open("GET","hastablechanged.php?tablename=awesometable",true);
  xmlhttp.send(null);
  }
else
  {
  alert("Your browser does not support XMLHTTP.");
  }
}

function state_Change()
{
if (xmlhttp.readyState==4)
  {// 4 = "loaded"
  if (xmlhttp.status==200)
    {// 200 = "OK"
    document.getElementById('A1').innerHTML=xmlhttp.responseText;
    }
  else
    {
    alert("Problem retrieving ata:" + xmlhttp.statusText);
    }
  }
}
</script>
</head>

<body onLoad="setInterval('loadPage()', 10000)">

<p><b>Status:</b>
<span id="A1"></span>
</p>

<button onclick="loadPage()">Check Updates</button>

</body>
</html>

Gus 2009-10-09 13:14:50

Thanks a lot :) I'll use this code to build the solution to the table changing contents. Hope it works. Thanks again! :)

echedey lorenzo 2009-10-09 14:04:35

Answer 2

A:

Just to be clear: you don't have to use ajax. Just reloading the page on regular interval will give you what you want. BUT if you want the application to be smooth - then you'll have to dig into AJAX as outlined in the other answers.

-CF

ChronoFish 2009-10-09 13:20:52

If he reloads the page on a regular interval then it doesn't need to check if it's been modified and doing automatic page refreshes is a horrible practice that died in the 90s.

Gus 2009-10-09 13:27:34

Yeah that is, flickering is not good at all. I started my web application with a meta refresh, but realized that it's a ugly solution for showing database data.

echedey lorenzo 2009-10-09 14:03:26

Answer 3

A:

Hi friends,

I finally figured out how to do it. Posting it so it can be useful for anybody.

It's a combination of php and javacript where:

php file return_timestamp.php simply returns the timestamp of a row with ID=0 (no real ID, it simply updates its timestamp in each insertion with a trigger)
javascript compares the received timestamp with the one previously received (the very first one is set to 0 so it updates the div in the beginning)

so:

javascript code which is the important thing (i assume you guys can code php retrieving data from mysql):

<script type="text/javascript">
$(document).ready(function() {

    $timestamp1='0';
    var refreshId = setInterval(function() {
    $.get(('return_timestamp.php', function(data) {
    $timestamp2 = data; } )

    if ( $timestamp2 != $timestamp1 ) { 

        $('#data').load('data.php');

        $timestamp1 = $timestamp2; }

}, 1000);
});
</script>

Hope it helps, and thanks as well for YOUR help!

echedey lorenzo 2009-10-20 16:38:54

ansaurus

tags:

views:

answers:

Simple Javascript MYSQL checking function

related questions