Question

I’m trying to setup spinner load for my pages with jQuery Mobile. However spinner doesn’t show itself when I’m loading something with Ajax. Here is my code. Any ideas what’s wrong with it?

$("#invite").live('pageinit', function(e) {
  var render = function (items) {
    var view = '',
    index = 0;
    items.forEach(function(date){
      view +=
        '<div class="ui-block" style="background:white;">' +
        date.address
        '</div>';
      index++;
    });
    return view;
  };
  $.mobile.showPageLoadingMsg();
  $.ajax({                  
    url: 'someurl.com/file.json',
    dataType: "json",
    success: function(data) {
      $('#list').html(render(data.shared_dates));
      $.mobile.hidePageLoadingMsg();
    }
  })
});

Answer 1

If you’re using jQuery Mobile 1.2 then you should be using the following:

$.mobile.loading( 'show' )

and

$.mobile.loading( 'hide' )

Docs: http://jquerymobile.com/demos/1.2.0/docs/api/methods.html