I have this Ajax Script:
if(ajax.readyState==4)
{
var respuesta=ajax.responseText;
document.getElementById('result').innerHTML=ajax.responseText;
$("#newaircraftdialog").dialog('close');
$(document).ready(function(){
refreshTable();
});
$("#loadingdialog").dialog('close');
}
The function refreshTable:
function refreshTable(){
$('#table').load('aircrafts_table.php');
}
The problem I have is that I want the #loadingdialog
to close when previous function refreshTable
completely finished. Now what it does is run the function, and then close the dialog, but the function needs time to refresh the table. So when you close the dialog function has not had time to update the table.
You simply have to call the dialog close() method once the refreshTable() method is finished. If the refreshTable() is calling an asynch method, then you need to call dialog's close method in the callback handler of that asynch method
@Edit: change your refreshtable() code into
function refreshTable(){
$('#table').load('aircrafts_table.php', function(){
//put that code to close that dialog box here
});
}
You could add a callback parameter to the refreshTable
function and then pass it whatever you wish to be run when it completes. For example:
function refreshTable(callback)
{
/* ... (refresh table code) */
if ('function' === typeof callback)
{
callback()
}
}
/* ... (AJAX request) */
refreshTable(function ()
{
$("#loadingdialog").dialog('close')
}
)
This way it should do like you want (see updated refresh table at the end of an answer):
if(ajax.readyState==4) {
var respuesta=ajax.responseText;
document.getElementById('result').innerHTML=ajax.responseText;
$("#newaircraftdialog").dialog('close');
refreshTable(function(){$("#loadingdialog").dialog('close');});
}
But I have no idea why you are mixing jQuery with pure JS (as it looks to me).
Suppose your code could be changed like this:
$(document).ready(function() {
$.ajax({url:ajax_url,
method:'GET',
dataType:'html',
success:function(res){
document.getElementById('result').innerHTML=res;
$("#newaircraftdialog").dialog('close');
refreshTable(function(){$("#loadingdialog").dialog('close');});
});
});
Please note that $(document).ready(function() {})
is called only once, after document is completely loaded. And it is not called again after ajax is done.
function refreshTable(callback){
$('#table').load('aircrafts_table.php', callback);
}