Firefox reconizes Ajax response but dumps it at the end

Firefox - IE Ajax differences

[southy]

I have a simple form on our site. Its an ajax driven form and the script send back a confirmation which is written in place of the original form. It works fine in IE but for some reason Firefox dumps the response at the end of the document - not into the div that it should.

The div id=container and the functions are below:

function prepareForm() {
if(!document.getElementById) {
return;
}
if(!document.getElementById("contactform")) {
return;
}
document.getElementById("contactform").onsubmit = function() {
var data = "";
for (var i=0; i<this.elements.length; i++) {
data+= this.elements[i].name;
data+= "=";
data+= escape(this.elements[i].value);
data+= "&";
}
return!sendData(data);
};
}

function sendData(data) {
var request = getHTTPObject();
if (request) {
request.onreadystatechange = function() {
parseResponse(request);
};
request.open( "POST", "/fLogic2.asp", true );
request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
request.send(data);
return true;
} else {
return false;
}
}

function parseResponse(request) {
if (request.readyState == 4) {
if (request.status == 200 ¦¦ request.status == 304) {
var container = document.getElementById("container");
container.innerHTML = request.responseText;
prepareForm();
}
}
}

function getHTTPObject() {
var xhr = false;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
} else if (window.ActiveXObject) {
try {
xhr = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
try {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
} catch(e) {
xhr = false;
}
}
}
return xhr;
}

I believe the problem lies in these statements:

var container = document.getElementById("container");
container.innerHTML = request.responseText;

Does anyone see the problem or have a hack/patch for Firefox?

Thanks.

[gergoe]

Your code looks fine, it might be something related to your HTML structure, the way the elements are embedded into each other, or might be something to do with the response you're receiving from to the AJAX request. For example if you receive a full document (with doctype declaration, head and body sections), you might get similar (unexpected) results.