ajax refresh??

[adrive]

I'm having some problem trying to load my results into a dedicated span/div.
I found that the sequence of ajax execution is random! I need its order to be correct
so that i can show a list of 'subjects' with latest added item.

in a html hyperlink, i'm calling this in sequence :

insertNewText();loadSubjectList();

Below are my codes and output, it contains,

1.) my insert code
2.) my display code
3.) my php code
4.) my logger output which shows the randomness happening

[hr]

1.) my insert code :

function insertNewText(){
		
		if(validate(document.frmNote.txtSubject, 'Subject')){
			try
			{
						
			var xmlHttp = GetXmlHttpObject();
			var url = null;
			var param = null;
			
			   xmlHttp.onreadystatechange=function()
			      {
			      if(xmlHttp.readyState==4)
			        {
			        document.frmNote.txtAreaNote.value=xmlHttp.responseText;					
			        }
			      }
			  
			url = "noteAction.php";

		    xmlHttp.open("POST", url, true);
			xmlHttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
			
			param = 'F_CALL=INSERTNEWTEXT';
			param += '&SUBJECT=' + document.frmNote.txtSubject.value;
			param += '&TEXT=' + document.frmNote.txtAreaNote.value;
			
			xmlHttp.send(param); 

			}
			catch(e){
				alert("Failed to save.");
			}
		}
		
	}

2.) my display code

function loadSubjectList(){
		try
		{
	
		var xmlHttp = GetXmlHttpObject();
		var url = null;
		var param = null;
		
		   xmlHttp.onreadystatechange=function()
			  {
			  if(xmlHttp.readyState==4)
				{
				document.getElementById('subjectList').innerHTML=xmlHttp.responseText;
				}
			  }
 
		url = "noteAction.php";

		xmlHttp.open("POST", url, true);
		xmlHttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
		
		param = 'F_CALL=GETSUBJECTLIST';
		
		xmlHttp.send(param);
		
		}
		catch(e){
			alert("Failed to load." + e.message);
		}
			
	}

3. my php code

if(isset($_POST['F_CALL'])){
	
	logger('F_CALL IS SET for ' . $_POST['F_CALL']);
	
		if($_POST['F_CALL'] == "GETSUBJECTTEXT"){
			
			echo getSubjectText();
			
			logger("get subject's text");		
		
		}else if($_POST['F_CALL'] == "INSERTNEWTEXT"){
		
			insertSubjectText();
			
			logger("insert subject's text");		
		
		}else if($_POST['F_CALL'] == "GETSUBJECTLIST"){
				
			echo getSubjectList();
				
			logger("get subject lists");	
		
		}
	}

4. my output that proves the randomness happening :

[22-11-07 03:39:14] F_CALL IS SET for GETSUBJECTLIST
[22-11-07 03:39:14] F_CALL IS SET for INSERTNEWTEXT
[22-11-07 03:39:14] get subject lists
[22-11-07 03:39:14] insert subject's text
[22-11-07 03:39:21] F_CALL IS SET for GETSUBJECTLIST
[22-11-07 03:39:21] F_CALL IS SET for INSERTNEWTEXT
[22-11-07 03:39:21] insert subject's text
[22-11-07 03:39:21] get subject lists
[22-11-07 03:39:22] F_CALL IS SET for INSERTNEWTEXT
[22-11-07 03:39:22] F_CALL IS SET for GETSUBJECTLIST
[22-11-07 03:39:22] get subject lists
[22-11-07 03:39:22] insert subject's text
[22-11-07 03:39:22] F_CALL IS SET for INSERTNEWTEXT
[22-11-07 03:39:22] F_CALL IS SET for GETSUBJECTLIST
[22-11-07 03:39:23] insert subject's text
[22-11-07 03:39:23] get subject lists
[22-11-07 03:39:33] F_CALL IS SET for INSERTNEWTEXT
[22-11-07 03:39:33] F_CALL IS SET for GETSUBJECTLIST
[22-11-07 03:39:33] insert subject's text
[22-11-07 03:39:33] get subject lists
[22-11-07 03:39:34] F_CALL IS SET for GETSUBJECTLIST
[22-11-07 03:39:34] F_CALL IS SET for INSERTNEWTEXT
[22-11-07 03:39:34] insert subject's text
[22-11-07 03:39:34] get subject lists

[~s.o.s~]

Ajax is asynchronous.

The time taken by the request to be completed and the response to reach the client depends on the time take at the server for processing each of the requests which may vary. A better way would be to call the 'loadSubjectList()' function inside the 'onreadychange' event handler of 'insertNew()' when the response is ready.

Also consider using a lightweight library for handling Ajax functionality since this can make you more productive and help you concentrate on the logic instead of cleaning the mess left by your Ajax code.

[adrive]

thanks for pointing that out sos, i didn't realise what i was doing on my readystate on insertnew() :)