Platform: PHP 5.3.9 with jQuery 1.7.1
I'm at wit's end with this one. I'm firing off two asynchronous AJAX calls at the same time, generateTPM() and updateProgress(). generateTPM() initiates a process that takes 50 seconds and updateProgress() polls a text file containing a JSON object representing the status of the process. updateProgress() will not return any results until generateTPM() is finished running, even though both are asynchronous.
$('#uiGenerateTPM').click(function(){
updateProgress();
generateTPM();
});
function generateTPM(){
var data = {
action:'generateTPM'};
var settings = {async:true,
success: function(json){
$('#uiMessageOverlayContent').append('<div id="uiProcessComplete">' + json.message + '</div>');
$('#uiMessageOverlayButtonContainer').html('<img src="/images/ui/ok.png" border="0" id="uiButtonOK" />');
$('#uiButtonOK').click(function(){$('#uiMessageOverlay').hide();});
},
data:data,
cache:false,
type: 'POST',
dataType:"json"};
$('#uiButtonOK').unbind("click");
$('#uiMessageOverlayButtonContainer').html('');
$('#uiMessageOverlay').show();
$('#uiMessageOverlayTitle').html('MRP System Status');
$('#uiMessageOverlayContent').html('Generating Time Phased Material Requirements<br />This may take a few minutes.');
var html = '<div id="uiMpsStatus"> </div>';
html = html + '<div id="uiTpmGenStatusContainer">';
html = html + '<div id="uiTpmGenProgressBarContainer"><div id="uiTpmGenProgressBar"> </div></div>';
html = html + '<div id="uiTpmGenStatus"> </div>';
html = html + '<div id="uiTpmGenProgress"> </div>';
html = html + '<div id="uiTpmGenProgress"> </div>';
html = html + '</div>';
html = html + '<div id="uiTpmGenEndStatusContainer">';
html = html + '<div id="uiTpmGenEndStatus"> </div>';
html = html + '<div id="uiTpmInsertStatus"> </div>';
html = html + '</div>';
$('#uiMessageOverlayContent').append(html);
$('#uiTpmGenProgressBarContainer').hide();
$.ajax('/ajax/mrp.ajax.php', settings);
}
function updateProgress() {
var data = {
action:'getProgressUpdate'};
var settings = {async:true,
success: function(json){
var done = false;
if(json!=null) {
if(json.MPS!=null) {
$('#uiMpsStatus').html(json.MPS.status);
}
if(json.TPM_Gen!=null) {
$('#uiTpmGenStatus').html(json.TPM_Gen.status);
var progress = ((Math.round(parseFloat(json.TPM_Gen.progress)*10000)/10000) * 100).toFixed(2);
$('#uiTpmGenProgress').html(' (' + progress + '%)');
$('#uiTpmGenProgressBarContainer').show();
$('#uiTpmGenProgressBar').css('width', progress + '%');
}
if(json.TPM_Gen_End!=null) {
$('#uiTpmGenEndStatus').html(json.TPM_Gen_End.status);
}
if(json.TPM_Insert!=null) {
$('#uiTpmInsertStatus').html(json.TPM_Insert.status);
}
if(json.Done==null) {
var t2 = setTimeout("updateProgress()", 1000);
} else {
clearTimeout(t2);
done = true;
clearProgressLog();
}
} else {
var t2 = setTimeout("updateProgress()", 1000);
}
},
data:data,
cache:false,
type: 'POST',
dataType:"json"};
$.ajax('/ajax/polling.ajax.php', settings);
}
As you can see, I'm making AJAX requests from two different files. The order in which I call the functions doesn't matter. Both possible ways give me the same result. The really bizarre thing is that I have this setup working on another part of the application. In fact, this very setup was working a couple of days ago until it suddenly broke yesterday, even though I have not changed this code in three weeks!
As I'm sure you can imagine, I'm scratching my head on this one. Any ideas or suggestions would be appreciated.
I'm at wit's end with this one. I'm firing off two asynchronous AJAX calls at the same time, generateTPM() and updateProgress(). generateTPM() initiates a process that takes 50 seconds and updateProgress() polls a text file containing a JSON object representing the status of the process. updateProgress() will not return any results until generateTPM() is finished running, even though both are asynchronous.
$('#uiGenerateTPM').click(function(){
updateProgress();
generateTPM();
});
function generateTPM(){
var data = {
action:'generateTPM'};
var settings = {async:true,
success: function(json){
$('#uiMessageOverlayContent').append('<div id="uiProcessComplete">' + json.message + '</div>');
$('#uiMessageOverlayButtonContainer').html('<img src="/images/ui/ok.png" border="0" id="uiButtonOK" />');
$('#uiButtonOK').click(function(){$('#uiMessageOverlay').hide();});
},
data:data,
cache:false,
type: 'POST',
dataType:"json"};
$('#uiButtonOK').unbind("click");
$('#uiMessageOverlayButtonContainer').html('');
$('#uiMessageOverlay').show();
$('#uiMessageOverlayTitle').html('MRP System Status');
$('#uiMessageOverlayContent').html('Generating Time Phased Material Requirements<br />This may take a few minutes.');
var html = '<div id="uiMpsStatus"> </div>';
html = html + '<div id="uiTpmGenStatusContainer">';
html = html + '<div id="uiTpmGenProgressBarContainer"><div id="uiTpmGenProgressBar"> </div></div>';
html = html + '<div id="uiTpmGenStatus"> </div>';
html = html + '<div id="uiTpmGenProgress"> </div>';
html = html + '<div id="uiTpmGenProgress"> </div>';
html = html + '</div>';
html = html + '<div id="uiTpmGenEndStatusContainer">';
html = html + '<div id="uiTpmGenEndStatus"> </div>';
html = html + '<div id="uiTpmInsertStatus"> </div>';
html = html + '</div>';
$('#uiMessageOverlayContent').append(html);
$('#uiTpmGenProgressBarContainer').hide();
$.ajax('/ajax/mrp.ajax.php', settings);
}
function updateProgress() {
var data = {
action:'getProgressUpdate'};
var settings = {async:true,
success: function(json){
var done = false;
if(json!=null) {
if(json.MPS!=null) {
$('#uiMpsStatus').html(json.MPS.status);
}
if(json.TPM_Gen!=null) {
$('#uiTpmGenStatus').html(json.TPM_Gen.status);
var progress = ((Math.round(parseFloat(json.TPM_Gen.progress)*10000)/10000) * 100).toFixed(2);
$('#uiTpmGenProgress').html(' (' + progress + '%)');
$('#uiTpmGenProgressBarContainer').show();
$('#uiTpmGenProgressBar').css('width', progress + '%');
}
if(json.TPM_Gen_End!=null) {
$('#uiTpmGenEndStatus').html(json.TPM_Gen_End.status);
}
if(json.TPM_Insert!=null) {
$('#uiTpmInsertStatus').html(json.TPM_Insert.status);
}
if(json.Done==null) {
var t2 = setTimeout("updateProgress()", 1000);
} else {
clearTimeout(t2);
done = true;
clearProgressLog();
}
} else {
var t2 = setTimeout("updateProgress()", 1000);
}
},
data:data,
cache:false,
type: 'POST',
dataType:"json"};
$.ajax('/ajax/polling.ajax.php', settings);
}
As you can see, I'm making AJAX requests from two different files. The order in which I call the functions doesn't matter. Both possible ways give me the same result. The really bizarre thing is that I have this setup working on another part of the application. In fact, this very setup was working a couple of days ago until it suddenly broke yesterday, even though I have not changed this code in three weeks!
As I'm sure you can imagine, I'm scratching my head on this one. Any ideas or suggestions would be appreciated.