0

When I build the hybrid app using crosswalk - android Back button is not working with onsen ui framework(using angular js).

Below is the code which i have used...

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

function onBackKeyDown() {
    // Handle the back button
    alert("Backbutton is pressed!");
    var element = document.querySelector(".navigator-container");
    var scope = angular.element(element).scope();
    scope.popPage();
}
kabaehr
  • 1,040
  • 11
  • 18
kalpit yadav
  • 1
  • 2

1 Answers1

1

As @kabaehr mentioned you may need to wait for everything to be ready first. That means either of the following:

document.addEventListener('deviceready', function(){ ... });

ons.ready(function(){ ... });

The other thing which may be specific to Onsen UI is the fact that it's already doing some handling of that event, so you could try to use the API which is given for that.

Here are the docs for that API. Currently it seems like the method which you want is:

ons.setDefaultDeviceBackButtonListener(onBackKeyDown)

Although that method doesn't sound too nice so maybe the name will change in the future.

For now feel free to try if any of these options seem to work for you.

Ilia Yatchev
  • 1,254
  • 7
  • 9
  • What exactly I am doing is I am loading my login page using xwalkview and after entering credentials , another page opens and when i move to another page and press back buttons it directly redirect me to login page instead of redirecting me to previous page.... – kalpit yadav May 05 '16 at 19:04
  • Hmm... strange - maybe it's not actually firing the event properly. Make sure that the `cordova.js` file is included and working. Maybe you can also just test `document.addEventListener('deviceready', function(){ document.addEventListener("backbutton", onBackKeyDown); });` even without Onsen UI and see if it works. That way we can see if it's a cordova or an onsen ui issue. – Ilia Yatchev May 06 '16 at 06:07
  • Can u send me the link to download the cordova.js ,may be i m using the different version – kalpit yadav May 06 '16 at 06:18
  • Well even an older version should be fine :). Here's the [cordova website](https://cordova.apache.org/#getstarted). You don't need to update if you ask me. It seems unlikely that it could be a version issue. You can use the one which you have, just make sure that you're adding it to your html. – Ilia Yatchev May 06 '16 at 06:35
  • I have added cordova.js also, but still it is not working, even it is not giving me alert in document.addEvent listener function onBackKeyDown. – kalpit yadav May 11 '16 at 06:32
  • Hm... I think I'm sort of running out of ideas here. The last 2 things which come to my mind are: 1. In that case does the `deviceready` event work at least? 2. You're building the application and deploying it as a an `.app` file right? – Ilia Yatchev May 11 '16 at 08:27
  • unfortunately, no. Basically cordova is the thing which provides the `backbutton` events. Hybrid apps are actually just web apps, which with cordova have access to some of the phone's capabilities. However cordova is the link. Without cordova.js you have only a webpage in the browser. Onsen UI is just a set of UI components to help make that page look like a native application. If it finds cordova then it adds some additional logic for it's components, however without it it's just a js file in a web page. So without cordova the backbutton is the backbutton of the browser (it quits the app) :( – Ilia Yatchev May 23 '16 at 09:05