jQuery throbber plug-in
jQuery throbber plug-in
Hello everyone,
I am experimenting with the jQuery throbber plugin (http://plugins.jquery.com/project/throbber). It does not behave the way I would expect it to.
My setup is as follows. I have a HTML form with a button. When the button is clicked, I initiate an AJAX request and would like to replace the button with a throbber. Upon reception of the response, the throbber must again be replaced with the button.
The relevant jQuery code looks like this:
// Prevent caching of the requested AJAX pages
jQuery.ajaxSetup({
cache: false
});
// Send the request to the server via AJAX
jQuery.get(url, params, handleAjaxResponse, 'html');
$(document).ready(function () {
$(function() {
// jQuery Throbber script: Make sure that the "Convert" button is converted into a throbber when clicked; upon receipt of the AJAX response from the server, the button should again be re-enabled
$("#btn_sendajax").throbber("click", {image: "images/throbber.gif", ajax: true});
});
});
The first issue I am facing is that the script's "ajax" option does not seem to work as expected. According to the documentation: "set the ajax option to true if the throbbers should listen to AJAX events. In this case, the throbbers are automatically hidden if all AJAX requests are completed." The automatic hiding on AJAX transaction completion does not work for me. Do we need to explicitly indicate that the AJAX transaction has completed, or is this determined automatically? Because the automatic throbber hiding does not seem to work, I have resorted to a call to $.throbberHide() in the handleAjaxResponse callback.
The second issue concerns the processing speed of AJAX requests. In case the AJAX response is received very quickly, the throbber fails to disappear. It seems almost as if the $.throbberHide() call is executed BEFORE (instead of after) the throbber is actually installed. I have "fixed" this issue by inserting an artificial 100 millisecond delay at server side when processing the AJAX request, but this is hardly elegant nor efficient.
Has anyone experienced similar problems with the jQuery throbber script? Any help would be largely appreciated!
Best regards,
Maarten Wijnants