I really need help on this,I know nothing about ajax.. and I really need this to include in my page

this is the original code : -

<html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="Andy Moore: http://locationdetection.mobi/">
  <title>TEST1</title>
  </head>
  <body>
		<div id="geo" class="geolocation_data"></div>
<?php
	include 'geojavascript.php';
?>	

  </body>
</html>

I would like to add ajax auto refresh.. to refresh the div link which is something like this : -

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <script src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
 <script>
var auto_refresh = setInterval(
function()
{
$('#geo').fadeOut('slow').load('geojavascript.php').fadeIn("slow");
}, 20000);
</script>


  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="Andy Moore: http://locationdetection.mobi/">
  <title>Locator</title>
  </head>
  <body>
		<div id="geo" class="geolocation_data"></div>
<?php
	include 'geojavascript.php';
?>	

  </body>
</html>

But, there is something wrong here... instead of refreshing the div.. it refresh html page only.. not the div data.. anyone.. please help me on this ?

thanks in advance guys...

<div id="geo" class="geolocation_data"></div>

I don't see you show any data in the div. Make it like this and try again.

<div id="geo" class="geolocation_data">default data</div>

What content in the 'geojavascript.php' file? If it is the page itself, you would have a problem. You need a HTML portion/page that should not be its own page because you may create multiple same div id/name when the page calls itself.

thanks for the feedback guys... ok this is the geojavascript.php code

<html>
<body>
<script type="text/javascript">

  var userid = "<?php echo $username; ?>";
// this is called when the browser has shown support of navigator.geolocation
function GEOprocess(position) {
	// update the page to show we have the lat and long and explain what we do next
  document.getElementById('geo').innerHTML = 'Latitude: ' + position.coords.latitude + ' Longitude: ' + position.coords.longitude;
	// now we send this data to the php script behind the scenes with the GEOajax function
	GEOajax("geo.php?accuracy=" + position.coords.accuracy + "&latlng=" + position.coords.latitude + "," + position.coords.longitude +"&altitude="+position.coords.altitude+"&altitude_accuracy="+position.coords.altitudeAccuracy+"&heading="+position.coords.heading+"&speed="+position.coords.speed+"&userid="+userid+"");
}

// this is used when the visitor bottles it and hits the "Don't Share" option
function GEOdeclined(error) {
  document.getElementById('geo').innerHTML = 'Error: ' + error.message;
}

if (navigator.geolocation) {
	navigator.geolocation.getCurrentPosition(GEOprocess, GEOdeclined);
}else{
  document.getElementById('geo').innerHTML = 'Your browser sucks. Upgrade it.';
}

// this checks if the browser supports XML HTTP Requests and if so which method
if (window.XMLHttpRequest) {
 xmlHttp = new XMLHttpRequest();
}else if(window.ActiveXObject){
 xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}

// this calls the php script with the data we have collected from the geolocation lookup
function GEOajax(url) {
 xmlHttp.open("GET", url, true);
 xmlHttp.onreadystatechange = updatePage;
 xmlHttp.send(null);
}

// this reads the response from the php script and updates the page with it's output
function updatePage() {
 if (xmlHttp.readyState == 4) {
  var response = xmlHttp.responseText;
  document.getElementById("geo").innerHTML = '' + response;
 }
}
setInterval("updatePage()", 1000);
</script>
</body>
</html>

anything I've missed?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.