9 Replies Latest reply on Mar 14, 2018 8:15 AM by pixellet5

    Control back button

    davidm10500452 Level 1

      Hi, Is there some way to control back button on Android devices? For example, if user press back button, the alert will display. I tried to do it in many ways, but nothing works. I found this code on github.com, but after pressing back button, the app will just close. Without alert.

       


      function init() {
        document.addEventListener("deviceready", onDR, false);
      }
      function onDR(){
        BackButton.override();
        document.addEventListener("backKeyDown", backKeyDown, true);

      }
      function backKeyDown() {
        alert('go back!');
      }

       

      Help please.

        • 1. Re: Control back button
          jcesarmobile_ Adobe Community Professional

          Is init being called?

           

          This is the code needed:

           

           

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

          function onBackKeyDown(e) {
               e.preventDefault();//This prevents the app from closing, but also from navigating back, you will have to handle navigation yourself

              alert('go back!');
          }

          1 person found this helpful
          • 2. Re: Control back button
            davidm10500452 Level 1

            Hi, thank you for answering me, but it is still not working. My code looks like this:

             

            But after I press the back button on my Android device, the app will just close. No alert. Could you please help?

            • 3. Re: Control back button
              jcesarmobile_ Adobe Community Professional

              You have to put the backbutton event listener inside the deviceready callback as you had at the beginning

              • 4. Re: Control back button
                jcesarmobile_ Adobe Community Professional

                Sample code:

                 

                <!DOCTYPE html>

                 

                <html>

                   <body>

                   <p id="demo"></p>

                   <script type="text/javascript" src="cordova.js"></script>

                   <script>

                   document.addEventListener('deviceready', onDeviceReady.bind(this), false);

                   function onDeviceReady() {

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

                  }

                   function onBackKeyDown(e){

                   e.preventDefault();

                   alert('quit');

                  }

                   document.getElementById("demo").innerHTML = "Hello Javascript!";

                   </script>

                   </body>

                </html>

                 

                 

                 

                 

                It's possible that your example didn't work because of the cordova.js missing, and/or because no waiting for deviceready event

                1 person found this helpful
                • 5. Re: Control back button
                  frared358 Level 1

                  jcesarmobile_ can I know how to get cordova.js file

                  • 6. Re: Control back button
                    jcesarmobile_ Adobe Community Professional

                    You don't have to add the actual cordova.js file, it's generated by Cordova/Phonegap/Phonegap build, you just have to link it in your index.html like this:

                     

                    <script type="text/javascript" src="cordova.js"></script>

                    1 person found this helpful
                    • 7. Re: Control back button
                      frared358 Level 1

                      Thank You For your answer..

                      I have one more query, When I click Back button my android app should exit.. please help me with this..

                       

                       

                      • 8. Re: Control back button
                        jcesarmobile_ Adobe Community Professional

                        I provided a complete example a few messages up on this thread. That should work fine.

                        • 9. Re: Control back button
                          pixellet5 Level 1

                          answer to all your questions

                           

                          function onBackKeyDown(e) {

                            

                                   e.preventDefault();

                                   navigator.notification.confirm("Are you sure you want to exit ?", onConfirm, "Confirmation", "Yes,No");

                                         // Prompt the user with the choice

                              }

                           

                          ///another function (mandatory) to show user a choice....you can add multiple conditions in the above function..like if a menu is open..it will first close the menu and then if the back button is hit again only then it will ask for option whether to exit the app or not

                          function onConfirm(button) {

                                          if(button==2){//If User selected No, then we just do nothing

                                              return;

                                          }else{

                                              navigator.app.exitApp();// Otherwise we quit the app.

                                          }

                                }