URL not being sent in AJAX in IE

[Raju Gautam]

Hello there,

I have a problem using a simple AJAX.
I have following HTML:

<div id="divComments" style="border:1px #000000 inset;width:400px;height:150px;overflow:auto;background-color:#FFFFFF;padding:2px;"></div>
		  <input name="cCommentID" type="text" value="" id="cCommentID">
		  <input name="totalComments" type="text" id="totalComments" value="<?php echo $TotalCommentsPHP;?>">
<table width="400" border="0" cellspacing="0" cellpadding="0">
            <tr>
              <td width="32&#37;" align="left"><a href="javascript:void(null);" onClick="PreviousComment();">&laquo; Previous</a></td>
              <td width="68%" align="right"><a href="javascript:void(null);" onClick="NextComment();">Next &raquo;</a></td>
            </tr>
          </table>

And I have this javascript code:

var jsComID=new Array();
jsComID[0]=1;
jsComID[1]=2;
jsComID[2]=3;
var objXMLHttp = null;
if(window.XMLHttpRequest)
	objXMLHttp = new XMLHttpRequest();
else if(window.ActiveXObject)
	objXMLHttp = new ActiveXObject("Microsoft.XMLHTTP");
if (objXMLHttp == null){
	alert ("Browser does not support HTTP Request");
}
function getObj(name){
	if (document.getElementById){
		this.obj = document.getElementById(name);
	}
	else if (document.all){
		this.obj = document.all[name];
	}
	else if (document.layers){
		this.obj = document.layers[name];
	}
	return this.obj
}
function ShowComment(url){
	objXMLHttp.onreadystatechange=AfterOperation;
	objXMLHttp.open("GET", url, true);
	objXMLHttp.send(null);
}
function AfterOperation(){
	var divObj = getObj('divComments');
	if(objXMLHttp.readyState == 1){
		//divObj.disabled = true;
	}
	if(objXMLHttp.readyState == 4 || objXMLHttp.readyState == "complete"){
		//divObj.disabled = false;
		divObj.innerHTML = objXMLHttp.responseText
	}
}
var commentidObj1 = getObj('cCommentID');
commentidObj1.value = 0;
ShowComment('./modules/projects/show_comments.php?project_id=<?php echo $_GET['project_id'];?>&comment_id=' + jsComID[commentidObj1.value]);

function PreviousComment(){
	var comid = "";
	var totalObj = getObj('totalComments');
	var commentidObj = getObj('cCommentID');
	if(commentidObj.value == 0){
		comid = totalObj.value;
	}
	else{
		comid = parseInt(commentidObj.value) - 1;
	}
	ShowComment('./modules/projects/show_comments.php?project_id=<?php echo $_GET['project_id'];?>&comment_id=' + jsComID[comid]);
	commentidObj.value = comid;
}
function NextComment(){
	var comid = 0;
	var totalObj = getObj('totalComments');
	var commentidObj = getObj('cCommentID');
	if(commentidObj.value == totalObj.value){
		comid = 0;
	}
	else{
		comid = parseInt(commentidObj.value) + 1;
	}
	ShowComment('./modules/projects/show_comments.php?project_id=<?php echo $_GET['project_id'];?>&comment_id=' + jsComID[comid]);
	commentidObj.value = comid;
}
//====================================

What i want is, just pass the Previous and Next comment to retrive comment in the div. It works fine in FF but nothing even error in IE 6. The URL that i passed on the onClick is not being sent to the server.

Of course, for the first time (i mean onLoad) it is retrieving the data. That means it works on Onload function but when i click on Next and Previous it does not work.

What may be the problem there?

Thank you in advance.

[SimplyFu]

it could be that your click event get trigger, and page being reloaded in IE instead of having its Ajax Request done. Maybe you can try to prevent the event bubbling to propagate.

[Raju Gautam]

Thank you for the reply. I found the mistake myself on my flow. The xmlHttp object was not created, instead it was used only without creating the object. I mean it is not inside the functions that i called thats why it was not working. When i put the object creation inside the function, then it worked for me fine. But i dont know why it was working in FF but not in IE.