CODEWITHSUNDEEP
jqueryjquery-mobile
user3476736
user3476736

Reputation: 105

Multipage Jquery mobile page - how to run a different function depending on the page who's loaded (pagecontainerbeforeload?)

https://fbcdn-sphotos-e-a.akamaihd.net/hphotos-ak-xaf1/t1.0-9/10013746_10152357263748463_7802091576467407720_n.jpg

<script>
    $(document).on('pageinit', '#page03' ,function(){
        drawTimeLine(3);
    });
</script>

I'm developing an app in jQuery Mobile and I'm pretty new to it.

I am using a multipage html and I want when the page who's id is "page04" loaded, to drawTimeLine(value) with a value=4 and when the page with id "page03" to the value for the drawTimeLine(value) to be 3 and so on…

I've tried for more than a week and still haven't succeeded.

If I understood correctly from the JQM api – I should use pagecontainerbeforeload in some way. If some more code is needed, please tell me and I'll reupload.

Upvotes: 2

Views: 85

Answers (1)

Gajotres
Gajotres

Reputation: 57309

Working example: http://jsfiddle.net/Gajotres/vds2U/

Javascript:

$(document).on('pagecontainershow', function () {
    pageId = $('body').pagecontainer('getActivePage').prop('id'); 

    if (pageId === 'index') {
        alert('Page index');
    }

    if (pageId === 'second') {
        alert('Page second');
    }    
});

pagecontainershow will trigger when every page is ready to be shown. Then you need to get page ID and do something during each page execution. Of course there are other page events but you need this one if you want to draw something.

This code used to be easier but latest page handling widget changed things a lot.

Upvotes: 2

Related Questions