Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jquery mobile, remove previous page

I'm using jquery mobile with phonegap. My app has two pages: login page and list page. When login successfully, the user will go to the list page. Afterwards, when they press the back button on their phone (android), they will go back to the login page. I don't want behavior like this. What I want is to exit the app.

like image 286
StoneHeart Avatar asked Jun 19 '12 11:06

StoneHeart


3 Answers

As I answered in this question: page hash and backbutton issue phonegap+Jquery

You can change pages without keeping them in browser history like so:

$.mobile.changePage('#page', {reverse: false, changeHash: false});

Unfortunately, I didn't manage to prevent the initial page from staying in browser history, so I used a workaround:

Page layout:

<body>    
    <!-- page_1 before page_loading in source -->
    <div data-role="page" id="page_1">
    </div>
    <!-- page_loading will be shown first -->
    <div data-role="page" id="page_loading">
        <div data-role="content">
            <h1 >
                <b>welcome</b>
            </h1>
        </div>
    </div>
    <div data-role="page" id="page_2">
    </div>    
</body>

jQuery:

function onBodyLoad()
{   
    //go to page_loading before deviceready without keeping it in browser history
    $.mobile.changePage('#page_loading', {reverse: false, changeHash: false});
    document.addEventListener("deviceready", onDeviceReady, false);
}

function onDeviceReady()
{   
    //your initialization code here...

    //now go to page_1 without keeping it in browser history since the actual first page was #page_1 already       
    $.mobile.changePage('#page_1', {reverse: false, changeHash: false});

    //your code here...
}

This should fit your needs, just try it out. "#page_loading" would be your login page, "page_1" your list page...

like image 185
Baris Akar Avatar answered Oct 25 '22 11:10

Baris Akar


Keep in mind that changeHash:false refers to the destination page, not to the source. You will not be removing the source page from history. Instead, the history hash will not be updated when moving to the new page

like image 21
Catalin Clabescu Avatar answered Oct 25 '22 09:10

Catalin Clabescu


If you use the latest version of jQuery mobile (1.4+) you can use this script:

$.mobile.pageContainer.pagecontainer('change', '#page', {reverse: false, changeHash: false});

jQuery.mobile.changePage is deprecated as of jQuery Mobile 1.4.0 and will be removed in 1.5.0.

like image 1
ggDeGreat Avatar answered Oct 25 '22 11:10

ggDeGreat