jqm+backbone.Js+require.Js show loading message before page load

I' m using Jquery mobile 1.1, I want to show the loading message before the page load using backbone router. the mobile init code is

$(document).bind("mobileinit", function() {
$.mobile.ajaxEnabled = false;
$.mobile.linkBindingEnabled = false;
$.mobile.hashListeningEnabled = false;
$.mobile.pushStateEnabled = false;

$.mobile.showPageLoadingMsg="loading";}

but the loading message is not shown. any suggestions?

Answers


Usual way is not going to help you because jQuery Mobile will show loader ONLY if page i loading into the DOM more then 10ms, even then it will hide when page is loaded into the DOM. Usually if page is complex this will be long before page is successfully show.

But you can manually show/hide it.

Here's a working example: http://jsfiddle.net/Gajotres/qx7Yn/

$(document).on('pagebeforecreate', '[data-role="page"]', function(){     
    var interval = setInterval(function(){
        $.mobile.loading('show');
        clearInterval(interval);
    },1);    
});

$(document).on('pageshow', '[data-role="page"]', function(){  
    var interval = setInterval(function(){
        //$.mobile.loading('hide');
        clearInterval(interval);
    },1);      
});

Basically all you want to do is show loader when page is about to be created and hide it during the pageshow event. In my case this line :

//$.mobile.loading('hide');

is commented because page is simple and it will load in a moment. Also dont forget to use this:

$.mobile.loader.prototype.options.text = "loading";
$.mobile.loader.prototype.options.textVisible = true;
$.mobile.loader.prototype.options.theme = "a";

Everything you need is in my jsFiddle example.

EDIT :

This example is compatible with jQuery Mobile 1.1.: http://jsfiddle.net/Gajotres/qx7Yn/


Need Your Help

Integrating a multidimensional integral in scipy

python math numpy scipy scientific-computing

Motivation: I have a multidimensional integral, which for completeness I have reproduced below. It comes from the computation of the second virial coefficient when there is significant anisotropy:

What's a Silverlight plugin?

asp.net silverlight silverlight-4.0

Please explain what a Silverlight plugin is. Is it a single xap file, a xaml file, a dll, or what? Please elaborate.

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.