AJAX, Firefox and innerHTML
Hi everybody!
The function below puts data in two HTML div containers on a webpage. In Internet Explorer, it works perfectly. However in Firefox, it only works for the "bookedShifts" div container - nothing appears in the second container?? If I uncomment the alert statement however, all the correct HTML is correctly stored in responseText, so I have no idea why innerHTML didnt put it in there! Anybody got any suggestions? Thanks very much for your help!
Code:
function updateShifts() {
/* Update booked shifts section */
var xhoBooked=GetXmlHttpObject();
if (!xhoBooked) {
alert( "This browser does not support the technology required to use this website.");
return false;
}
url = "phplib.php?function=updateBookedShifts";
var bookedShiftsContainer = document.getElementById('bookedShifts');
xhoBooked.onreadystatechange = function() {
if ( xhoBooked.readyState == 4 ) {
bookedShiftsContainer.innerHTML = xhoBooked.responseText;
}
}
xhoBooked.open( "GET", url, true );
xhoBooked.send( null );
/* Update available shifts section */
var xhoAvail=GetXmlHttpObject();
if (!xhoAvail) {
alert( "This browser does not support the technology required to use this website.");
return false;
}
url = "phplib.php?function=updateAvailShifts";
var availShiftsContainer = document.getElementById('availShifts');
xhoAvail.onreadystatechange = function() {
if ( xhoAvail.readyState == 4 ) {
availShiftsContainer.innerHTML = xhoAvail.responseText;
//alert( xhoAvail.responseText );
}
}
xhoAvail.open( "GET", url, true );
xhoAvail.send( null );
}
