If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

Ajax: Working in IE but not Mozilla?

Hi all,

QUICK SUMMARY:
Ajax code is pulling in HTML data, the results are slightly off in Firefox.

The HTML being pulled in by Ajax is a <h2> tag with an <a> tag nested within, plus a <p> tag following the <h2>. But Firefox only displays the <h2> tag and not the <p> tag, yet IE displays all the HTML code fine.

FULL EXPLANATION:
I'm fairly new to Ajax and was running some tests when I ran into a problem.

The HTML content (for andy.html / jeremy.html / richard.html) is a <h2> tag with an <a> tag nested within, plus a <p> tag following the <h2>. But Firefox only displays the <h2> tag and not the <p> tag, yet IE displays all the HTML code fine.

var XMLHttpFactories = [
// the function "fnCreateXMLHTTPObject" uses a reference to this array object.
function () {return new XMLHttpRequest()},
function () {return new ActiveXObject("Msxml2.XMLHTTP")},
function () {return new ActiveXObject("Msxml3.XMLHTTP")},
function () {return new ActiveXObject("Microsoft.XMLHTTP")},
];
function fnCreateXMLHTTPObject()
{
// this function loops through the array of XMLHttpRequest objects
// it then stores the correct object in the variable 'xmlhttp'.
// first set the variable to false to prevent an error being returned as true.
var xmlhttp = false;
// loop through the above array
for (var i=0;i<XMLHttpFactories.length;i++)
{
try
{
// first set the found object to the variable...
xmlhttp = XMLHttpFactories[i]();
}
catch (e)
{
// ...if there is an error with the object then just continue because the current object can't be used.
continue;
}
// otherwise break after setting the object to the variable.
break;
}
// return the object stored in the variable.
return xmlhttp;
}
function fnSendRequest(url, callback, postData, data)
{
// this function requests the file and sends it to the callback function.
var supportCheck = document.createElement && document.getElementsByTagName && fnCreateXMLHTTPObject();
if (!supportCheck) return;
// If the browser doesn't support the W3C DOM & the XMLHttpObject then stop without going any further.
// if the XMLHttpRequest object can't be created then stop without going any further.
var http_request = fnCreateXMLHTTPObject();
if (!http_request)
{
alert('Giving up :( Cannot create an XMLHTTP instance');
return;
}
// check the method type. if 'postData' is get then set the 'method' variable to GET, otherwise set it to POST
var method = (postData == 'GET') ? 'GET' : 'POST';
// check the state changes as they happen.
http_request.onreadystatechange = function ()
{
if (http_request.readyState != 4)
{
// if the state is not fully loaded then return the function - the onreadystatechange will call everytime a change occurs.
return;
}
// check the status code of the HTTP server response. 200 is an "ok response" and the 304 is the same for related to Safari.
if (http_request.status != 200 && http_request.status != 304)
{
// if there was an error at any point then display an error message and then return.
alert('HTTP error ' + http_request.status);
return;
}
// otherwise if it hasn't already returned the function via the 2 above if statements, then it must be loaded!
callback(http_request);
}
if(method == 'POST')
{
http_request.open(method, url, true);
http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
http_request.send(data);
}
else
{
http_request.open(method, url, true);
http_request.send(null);
}
}
function fnHandle(http_request)
{
// this function handles the XMLHttpRequest object.
var o = fnGetElement('id-Content');
o.innerHTML = http_request.responseText;
}

I used a JavaScript alert message to display on screen what data was being returned. For example:

Code:

alert(http_request.responseText)

...and ALL the HTML code is displayed in the alert box, so obviously Firefox is definitely picking up all the HTML but I just cannot work out why only the <h2> tags is shown when applying the 'http_request.responseText' to the page?