Reputation: 3
There's a TinyMCE textarea on my website. When i click the "Save" button, the function save(); is called. It should lock the TinyMCE Editor while saving (assume save.php takes a few seconds to load). Even though formProgress(1) is the first line of code in my save() function, it won't be executed right away. The editor just gets locked for a moment AFTER the ajax call has completed. Anyone know how to fix that?
function save()
{
formProgress(1); //why won't this be executed right away? for some reason i can see the result of this only when the ajax call is complete?!
jQuery.ajax({
url: 'save.php',
type: 'POST',
data: 'html=' + $('textarea[name=content_html]').tinymce().getContent(),
completed: function() { formProgress(0); },
async : false
});
}
function formProgress(mode)
{
if(mode == 1)
{
$('textarea[name=content_html]').tinymce().setProgressState(1);
}
else
{
$('textarea[name=content_html]').tinymce().setProgressState(0);
}
}
Upvotes: 0
Views: 379
Reputation: 630379
It does complete right away, the issue is here:
async : false
The way async: false
works also locks up your browser, so although everything before does happen before....but your UI is locked up and won't be updated until the XmlHttpRequest completes.
This is one of the main reasons not to use async: false
whenever possible.
Upvotes: 3
Reputation: 8117
Try this function call asynchronously by using settimeout e.g.
function save()
{
setTimeout("formProgress(1)",1000);
// AJAX call
}
Upvotes: 0
Reputation: 195982
the setProgressState
method accepts as parameter a time delay for appearing.
This implies that it is called with a setTimeout
so this would explain why it has not yet been shown when the code moves to the next line.. (the ajax call)
Upvotes: 0