Software Archive
Read-only legacy content
17061 Discussions

Disable back button

Dani_Carla
Beginner
4,243 Views

Hi guys

How to disable the back button?
 

0 Kudos
1 Solution
Hamilton_Tenório_da_
Valued Contributor I
4,243 Views

I use this:

document.addEventListener("backbutton", yourCallbackFunction, false);

View solution in original post

0 Kudos
17 Replies
Amrita_C_Intel
Employee
4,243 Views

Hello,

Just uncheck this box on the upper right corner

BackButton_0.PNG

0 Kudos
Hamilton_Tenório_da_
Valued Contributor I
4,244 Views

I use this:

document.addEventListener("backbutton", yourCallbackFunction, false);
0 Kudos
Dani_Carla
Beginner
4,243 Views

Amrita C.
I dont use App Designer

Hamilton
I used your code
<script>
document.addEventListener("backbutton", yourCallbackFunction, false);   
</script>

But not work... I am using correctly?

0 Kudos
Anusha_M_Intel1
Employee
4,243 Views

I am afraid I do not understand your question. 

You are not using App Designer but you want to disable back button? Where did this back button come from? Is it in your header? If so, can you post your header code?

 

0 Kudos
Dani_Carla
Beginner
4,243 Views

Sorry... I mean the phone button:



I put red arrows... to see:

0 Kudos
Dale_S_Intel
Employee
4,243 Views

Dani Carla wrote:

I used your code
<script>
document.addEventListener("backbutton", yourCallbackFunction, false);   
</script>

 

But not work... I am using correctly?

"yourCallbackFunction" is shorthand for "insert your own function here", so if you pasted that code as is without defining "yourCallbackFuncion", you'd get a problem because it's not defined.  You could probably do this:

<script>
document.addEventListener("backbutton", null, false);
</script>

Or you should be able to do this:

<script>
document.addEventListener("backbutton", function () {}, false);   
</script>

The point is to provide an event handler that doesn't do anything and the "false" is essentially to prevent it other handlers from acting on it.  The details are more complicated than that, but that's the gist.

0 Kudos
Anusha_M_Intel1
Employee
4,243 Views

Use the Phonegap's event API. Add this code in your device ready.

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

 

0 Kudos
Dani_Carla
Beginner
4,243 Views

Sorry guys... Dont work in these options :(

0 Kudos
Amrita_C_Intel
Employee
4,243 Views

 

Try using the event shown here to leverage Intel XDK JavaScript APIs assuming you are going to build with cordova. Using this event should allow you get the functionality 
https://software.intel.com/en-us/node/493108

0 Kudos
John_H_Intel2
Employee
4,243 Views

Make sure to enable the appropriate intel.xdk plugin for it to work correctly :)

0 Kudos
Dale_S_Intel
Employee
4,243 Views

This worked for me:

  1. Create a new "HTML5 + Cordova" project
  2. Add this code to the function onAppReady() in the file js/app.js:

        document.addEventListener('backbutton', function() {alert("Intercepted");}, false);

  3. Run this code on a device (I tried it using the debug tab on a usb connected Android phone

  4. Press the back button - you should see an alert that says "Intercepted"
  5. After dismissing the alert, you should still be in your app, not back to the home screen

 

0 Kudos
Mario_R_
Beginner
4,243 Views

Dale Schouten (Intel) wrote:

This worked for me:

  1. Create a new "HTML5 + Cordova" project
  2. Add this code to the function onAppReady() in the file js/app.js:

        document.addEventListener('backbutton', function() {alert("Intercepted");}, false);

  3. Run this code on a device (I tried it using the debug tab on a usb connected Android phone

  4. Press the back button - you should see an alert that says "Intercepted"
  5. After dismissing the alert, you should still be in your app, not back to the home screen

 

Hello Dale,

I followed your instructions step by step but it does not work. After allert the app closes. I tested on Android using the Ionic framework.
I am attaching the project file, are a few lines to test the BackButton.

Could you explain what has gone wrong?
Thank you

 

 

0 Kudos
PaulF_IntelCorp
Employee
4,243 Views

Mario -- official Cordova instructions here > http://cordova.apache.org/docs/en/6.x/cordova/events/events.html#backbutton <

0 Kudos
Mario_R_
Beginner
4,243 Views

Paul F. (Intel) wrote:

Mario -- official Cordova instructions here > http://cordova.apache.org/docs/en/6.x/cordova/events/events.html#backbutton <

Paul, does not work, I invite you to watch the simple project attached "HTML5 + Cordova" with Ionic and test it on an Android device.
I added some alert in the code that you suggested. After pressing the backbutton on smartphone displays the alert, then the application closes (Android).

Thank you

0 Kudos
Abhinay_M_
Beginner
4,243 Views

 Hello guys,

 I am working on cordova and i am stuck on mobile's back button pressed. I want to disable back button so that user can only use app's back button for that i need to disable the back button it is not working. Can anyone please tell me how to do this?

0 Kudos
Reply