Menu
I have an issue I’ve been working on, related to AJAX it appears, that has been driving me nuts for months. Below are the 2 relevant functions. The saveTabFields function is the one called, and the first 2 lines show an overlay with a loading bar, then of course the last makes it dissapear again. The saveEdit function is essentially my ajax call which as you can see gets called multiple times. Actually, there are 2 strange issues here.
First of all, the fact that I have to put in the pausecomp calls if not IE (pausecomp does just what it sounds like) to put delays between the ajax calls. In firefox, if there is no delays, the ajax call does not do it’s job (field is not saved). This is weird. And actually, this is only the case for FireFox 3.x, they were not needed in 2.x
The second issue, and more important right now, is that no matter what I do, the first 2 lines that show the loading divs don’t actually execute until the last setTimeout line (or they do occur first but appear not to because of the asynchronous nature of ajax). So basically what’s happening, and I can tell because of the pausecomp calls, is when a user clicks save on my form, the ajax calls are made saving all fields (basically, it appears nothing is happening for a couple seconds) THEN the loading divs show for 2.5 seconds.
See this video to see it in action since it is hard to explain. You’ll see after clicking save, it appears to do the ajax/pausecomps BEFORE showing the divs then hiding them with a setTimeOut:
[URL=”http://www.worldwidewes.com/out.avi”]Vid
Any ideas?
[CODE]function saveEdit(field,element,module,rid,call){
if (httpObject != null) {
httpObject.open(“GET”, “clVEProcessor.php?module=”+module+”&id=”+rid+”&field=”+field+”&value=”+document.getElementById(field).value+”&function=”+call, true);
httpObject.send(null);
}
}
function saveTabFields(tname){
document.getElementById(‘loader’).style.display=’block’;
document.getElementById(‘backendCover’).style.display=’block’;
var myDiv = document.getElementById(tname);
var inputArr = myDiv.getElementsByTagName(“input”);
for(i=0; i<inputArr.length; i++){
if(inputArr[i].type!=’radio’ && inputArr[i].type!=’checkbox’ && inputArr[i].type!=’hidden’){
saveEdit(inputArr[i].name,inputArr[i].name,document.getElementById(inputArr[i].name+”mod”).value,document.getElementById(inputArr[i].name+”id”).value,document.getElementById(inputArr[i].name+”call”).value);
}
if (navigator.appName!=’Microsoft Internet Explorer’)
pausecomp(20);
}
setTimeout(“document.getElementById(‘loader’).style.display=’none’; document.getElementById(‘backendCover’).style.display=’none’;”,2500);
}