AJAX Tutorial Help

[Ravinos]

Most of the tutorials I've looked at so far don't really offer much easy to understand help. I know a bit about javacript but soem reason I can't really get a grasp on AJAX and how to get everything to play nice.

I'm looking for someone to give me a plain example of how to call data from a mysql table with ajax and have it automatically update without refreshing the page itself. For instance health bars updating automatically as the database gets updated.

Right now I have my health, mana, action bars loaded in a separate iframe that is refreshed when my javascript is called. To do it this way is rather ugly because when it reloads in flashes. What I want it to try and get it to just refresh the individual numbers without reloading the full frame.

Below is what I currently use to get the job done but like I said....it's ugly and sometimes jams the frame from loading and end up being blank.
<script type="text/javascript">
window.parent.statpanelframe.location.reload()
</script>

[Torniquet]

i would suggest looking @ halls countdown timer code and finding chris' username checker tutorial. and try to mix and match them abit.

cant help no further sorry

[hallsofvallhalla]

this is the most simple way to do it, just call the function ---> updatestats();

then place the function between javascript tags in your php code like so

<script type="text/javascript">

Code: Select all

function updatestats()
		{
		
		var health = "<?php echo $playerinfo3[hpoints];?>";
		   var pid = "<?php echo $playerinfo3[name];?>";
		   
		var ajaxRequest;  		
	try{
		// Opera 8.0+, Firefox, Safari
		ajaxRequest = new XMLHttpRequest();
	} catch (e){
		// Internet Explorer Browsers
		try{
			ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try{
				ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e){
				alert("Your browser sucks!");
				return false;
			}
		}
	}
	ajaxRequest.onreadystatechange = function(){
		if(ajaxRequest.readyState == 4){
			
		}}
		var queryString = "?pid=" + pid + "&health=" + health ;
	ajaxRequest.open("GET", "updatestats.php" + queryString, true);
		ajaxRequest.send(null); 
		}
</script>
	

then make a script updatestats.php where the actual query takes place. remember to use a $_GET statement to get pid and health. Ajax will call that script from the server without the player even knowing it....if you do not use document.html style tags for your stat output on the page you will have to refresh regardless.That is why I always put this right after the ajaxrequest.send(null)

Code: Select all

window.setTimeout("finalizeupdate();",300); 

then make the function to reload the window, its quick and barely visible. I leave it at 300 so that you give it enough time to call the script and get back to the ajax query

Code: Select all

	
	function finalizeupdate()
	{
	
	window.location.href = "index.php";
	}
	

[Ravinos]

I guess it's all in the explanation lol. Thank you Halls. I read through it and suddenly it clicked lol. I don't know what it is about the way you explain things but with reading other's tutorials I'm normally lost but you.....you are the man!

I built a "master clock" script to keep everything timed and refreshed. Now i just need to redo some of my page's formatting/css and everything should work out fine. My test page works fine. Th blinking pages are finally gone

[hallsofvallhalla]

sweet glad I could help.