Search jQuery

jQuery Forum

$.mobile.loading('show') usage

in jQuery Mobile • 7 months ago

I wrote the following code to load data. During the loading, I would like to show the loading spinner using $.mobile.loading('show').

$(document).bind('pageinit', function() {
$.ajax({
url: 'http://testserver/data',
type: 'GET',
dataType: 'json',
beforeSend: function() { $.mobile.loading('show') },
complete: function(jqXHR, textStatus) { $.mobile.loading('hide'); }
});
});

The spinner is not showing at all with this code. However, when using $(document).ready() instead of $(document).bind('pageinit') (which is not correct with jQuery Mobile), the spinner is shown correctly.

Can anyone tell me what I am doing wrong? (using JQM 1.2.0 RC2)

Thanks.
Xavier

Replies(3)

Marten

Re: $.mobile.loading('show') usage

7 months ago

Any solution?

I'm having the exact same problem. (using JQM 1.2.0).

zoulou2356

Re: $.mobile.loading('show') usage

7 months ago

I have no solution yet. I finally decided to use an alternate solution, I use a plugin called spin.js instead (http://fgnass.github.com/spin.js/)

tsehested

Re: $.mobile.loading('show') usage

6 months ago

This has been bugging me as well.

Have almost tried all.. finally... if I excluded my $.changePage the spinner would load, so far so good, I presumed that the $.mobile.loading would be triggered from a $.ajax call automatically and hide itself based on the ajaxStart/ajaxStop, and that changePage will also be prevented from executing/changing. This is not working in 1.2.x - changePage ignores this totally. So for now one would not have to do this on every ajax call:

$('foo').live("click", function() {

ajax_call(some_var);

$(document).ajaxStop(function() {

$.mobile.changePage("#menulist", { transition: "pop"} );

$.mobile.loading('hide'); // gives the changePage time to complete the enhancements

});

And in mobileinit:

$(document).ajaxStart(function() {

$.mobile.loading('show');

});

// ajaxStop is totally ignored by changePage() so pointless...

$(document).ajaxStop(function() {

$.mobile.loading('hide');

});

@zoulou2356, I am using a multipage, make a dummy page before you real main page.. then changePage to that page when the ajaxStop is triggered...

Top Reply

Response title

Attachments

jQuery Forum

$.mobile.loading('show') usage

Replies(3)

Re: $.mobile.loading('show') usage

Re: $.mobile.loading('show') usage

Re: $.mobile.loading('show') usage

Statistics

Tags

Actions

Related Posts