Long time no post :-)
I want to apologize in advance for the long post.
On a webpage I have a 'button-styled' <a></a>
excerpt...
PHP Code:
<li>
      <
a href="" onClick="InsertRapport('.$klas.');">
            <
img src="/pics/lco_add_rapport.png" />'.$_LANG['IMG']['ADD_RAPPORT'].'
      
</a>
</
li
As you can see, when the 'button' is clicked, a javascript is called and passes a php variable along. => works fine
The function that is called:
Code:
function loadXML_post1(postvars,url,cfunc){
	if (window.XMLHttpRequest){
	// code for IE7+, Firefox, Chrome, Opera, Safari
		xmlhttp1=new XMLHttpRequest();
	}
	else{
	// code for IE6, IE5
		xmlhttp1=new ActiveXObject("Microsoft.XMLHTTP");
	}

	xmlhttp1.onreadystatechange=cfunc;
	xmlhttp1.open("POST",url,true);
	xmlhttp1.setRequestHeader("Content-type","application/x-www-form-urlencoded");
	xmlhttp1.send(postvars);
}
function InsertRapport(klas){
	postvars="klas="+klas;
	loadXML_post1(postvars,"/includes/ajax/insertrapport.php",function(){
        //alert('readystate: '+xmlhttp1.readyState+' status:'+xmlhttp1.status);
		if(xmlhttp1.readyState==4 && xmlhttp1.status==200){
			SetSelector(klas,0);
		}
	});
}
The php script 'insertrapport.php' updates a MySQL database => which is working fine
However it has nothing to return to the browser, instead I want another function (SetSelector()) to be called if script finishes and succeeds.
Code:
function SetSelector(klas,rapport){
	if(klas == 0 && rapport == 0){
		var rapport = document.getElementById("selrapport").value;
		var klas = document.getElementById("selklas").value;
	}
	postvars="rapport="+rapport+"&klas="+klas;
	loadXML_post1(postvars,"/includes/ajax/setselector.php",function(){
		if(xmlhttp1.readyState==4 && xmlhttp1.status==200){
			document.getElementById("selector").innerHTML=xmlhttp1.responseText;
			GetRapport(klas,rapport);
		}		
	});
}
function GetRapport(klas,rapport){
	var loader = "<img src=\"/pics/lco_clock_small.gif\" />";
	postvars="rapport="+rapport+"&klas="+klas;
	document.getElementById("rapport").innerHTML=loader;
	loadXML_post1(postvars,"/includes/ajax/getrapport.php",function(){
		if(xmlhttp1.readyState==4 && xmlhttp1.status==200){
			setTimeout(function(){document.getElementById("rapport").innerHTML=xmlhttp1.responseText;},750);
		}
	});
}
The first "if" in the SetSelector() function is used when the function is called directly with another element on the page (an onChange from a dropdown) => which works. So the call in SetSelector() for GetRapport() is indeed executed and gives the exact response into
HTML Code:
<div id="rapport"></div>
However when InsertRapport() is fired I get a xmlhttp1.readystate == 4 and a xmlhttp.status == 0 (at the Alert() level)

In other words: Why can I nest a Ajax query in one case and why not in the other case? What am I doing wrong?

- I tried to make the InsertRapport function echo something back to a foo div (which I added in the html) in the browser by adding the line: document.getElementById("foo").innerHTML=xmlhttp1.responseText; right before I call SetSelector() (This to make it really look the same as SetSelector() ) => no luck
- I read about the security issue about cross-site scripting and implemented an url rewrite, but as everything is on localhost it was destined to be of no help :-)
- I tried creating a separate xmlhttp object for each function => no success
- ...

The only thing that pops in mind while I'm writing the Thread is the fact that the InsertRapport() function is not triggered from within a <form> (it's just a button styled link) whereas the SetSelector(), if fired from the webpage, not from within InsertRapport(), is actually a <form><select onChange=...><option>....</option></select></form>
Could this be the cause?