How do I disable Android Back button on one page and change to exit button on every other page

android cordova jquery-mobile back-button-control

41,003

Solution 1

deviceready is important. If not used, sometimes you can get blocking Back button, sometimes not. Often in debug it works, in production no.

document.addEventListener("deviceready", onDeviceReady, false);
    function onDeviceReady() {
        document.addEventListener("backbutton", function (e) {
            e.preventDefault();
        }, false );
}

EDIT 2013-11-03 Common mistake is that development is performed on desktop and cordova script is excluded. One then forgets to include the cordova script for the mobile version.

Solution 2

Try this:

document.addEventListener("backbutton", function(e){
    if($.mobile.activePage.is('#login_page')){
        e.preventDefault();
    }
    else {
        if (confirm("Are you sure you want to logout?")) {
            /* Here is where my AJAX code for logging off goes */
        }
        else {
            return false;
        }
    }
}, false);

Solution 3

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    document.addEventListener("backbutton", function (e) {
        e.preventDefault();
    }, false );
}

41,003

Author by

Admin

Updated on December 08, 2020

Comments

Admin over 3 years

I am developing an Android application using Phonegap that interacts with my Drupal site. I have re-assigned the Android "Back" button to prompt the user to log off from the Drupal server however, I just want it disabled on the login page (for obvious reasons). I can get it to work but only until the user logs out then once on the login page the button remains re-assigned as a logoff button. Here's the code I have so far:

   <head>
         <script>
        /* Wait until device is ready to re-assign Back button */
        document.addEventListener("deviceready", onDeviceReady, false);
        function onDeviceReady() {
            document.addEventListener("backbutton", onBackKeyPress, false);
        }
        function onBackKeyPress() {
            /* If the current page is the login page, disable the button completely (aka do nothing) */
            if ($.mobile.activePage.attr('id') == 'login_page') {
            }

            /* Else, execute log off code */
            else {
                if (confirm("Are you sure you want to logout?")) {
                    /* Here is where my AJAX code for logging off goes */
                }
                else {
                    return false;
                }
            }
        }
        </script>
</head>

The problem is that the Back button doesn't get re-assigned. I cannot figure out a way to re-run the above code when the user logs out and ends up back on the login page.

If anybody is willing to provide a solution for this I will be very grateful!

JamesRLamar over 10 years

Works for me PhoneGap 2.7
Juan Carlos Alpizar Chinchilla over 7 years

doing this in my project, seems to be running only once, so it enters the if sentence, prevent the default execution of the back button and leaves, then the back button is not functional in any page on the app