Basem
Basem

Reputation: 614

jQuery Mobile pageinit not working on first load pages (replicable)

Reloading a page or navigating directly to the jQuery Mobile hash URL does not fire the pageinit even once. For example, I have tried this on my secondary page:

    $(function () {
        $(page).bind('pageinit', function () {
            console.log('bind pageinit');
        });
        $(document).on('pagecreate', page, function () {
            console.log('pagecreate');
        });
        $(document).on('pageshow', page, function () {
            console.log('pageshow');
        });
        $(document).on('pageinit', page, function () {
            console.log('pageinit');
        });
    });

While on page one, I click to go to the page two and the above life cycles gets written to the console. The URL also appended #two. This is great, but when going to the link on another machine, the page init does not fire. It seems only a button click can trigger the page init.

I have a live example here: http://dl.dropbox.com/u/5986646/jqm-pageinit.html. Paste this in the URL and events do not trigger: http://dl.dropbox.com/u/5986646/jqm-pageinit.html#two (notice the hash URL).

Upvotes: 0

Views: 1797

Answers (1)

Yes I had the same problem.

For execute some javascript code on page init a use this structure:

$(document).bind("mobileinit", function(){
    $('#mainPage').live('pageshow', function(){
        // Some Javascript code
    });
});

Now I can execute code all the time that the page was called.

Upvotes: 3

Related Questions