I'm building a PhoneGap mobile app with Onsen UI on the top.
I want the basic android back button to work with the onsen navigator and ons-sliding-menu, so it does what it's supposed to do.
I don't want it to close the app.
To prevent the back button from closing the app, I used the following code in the index.js files onDeviceReady event:
document.addEventListener("backbutton", onBackKeyDown, false);
function onBackKeyDown(e) {
e.preventDefault();
}
What changes should I make, for the back button to work properly?
Checking the Documentation I found that to control navigation you could use the pushPage and popPage functions.
So maybe try something like this:
document.addEventListener("backbutton", onBackKeyDown, false);
function onBackKeyDown(e) {
e.preventDefault();
yourNavigator.popPage('page.html');
}
Related
I'm using Meteor and Cordova to develop an Android app. I need to handle the backbutton event so the slideout closes if it is open, or continues with default execution is slideout is closed:
document.addEventListener('backbutton', function (e) {
if (slideout.isOpen()) {
e.preventDefault()
e.stopPropagation()
slideout.close()
}
})
This code is inside Template.mainLayout.onRendered on main layout.
Also tried reducing the code to just
document.addEventListener('backbutton', function(){})
and this leads to absolutely no functionality for the backbutton.
How can i disable android device back button click in Phonegap OpenUI5 application? Tried this but didn't work:
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady()
{
document.addEventListener("backbutton", function (e) {
e.preventDefault();
}, false );
}
Generally speaking, browsers don't allow you to disable the back button. This is for security/usability reasons so that you can't trap the user on your webpage. Hence, you need to think twice before doing it to make sure that you're actually trying to help your user.
That having been said, there are techniques described here that might work for you.
I would personally suggest that you do the right thing and rather than disable the back button you simply handle the event and do the appropriate clean up in your app.
In SAPUI5 you can use jQuery to listen to navigation events:
// event fired when the user changes the URL, e.g. forward or back navigation
// you need to implement the handleNavigate handler
$(window).on("navigate", handleNavigate)
// event fired when the user tries to close the browser or reload the page
// you need to implement the handleBeforeUnload handler
$(window).on('beforeunload', handleBeforeUnload);
Good day,
I am new to phonegap and JQM...
I have a problem with phonegap and JQM.i did a login and logout application but the backbutton on android being the secure page back after I logout, instead of exiting the application or do something else ... Secondly, how will I remove backbutton event in phonegap...thirdly, must I control the backbutton in my application?
In case you want backbutton to exit an app in one page and in other to act as a real back button you should use this:
document.addEventListener("backbutton", onBackKeyDown, false);
function onBackKeyDown() {
if($.mobile.activePage.is('#loginpage')){
navigator.app.exitApp(); // Exit app if current page is a login page
}
else {
navigator.app.backHistory(); // Go back in history in any other case
}
}
To remove/prevent a backbutton event use this:
document.addEventListener("backbutton", function(e){
e.preventDefault();
}, false);
And yes you must control your backbutton app event.
We have developed an application in jQuery integrated with android (which has only one activity). From this activity we are loading an HTML file, on this file we are showing and hiding the div contents. On viewing the web pages provided here and pressing back button provided in android, the application exits. We want the application to go to the previous page on clicking the back button.
(On clicking the android back button we need to show the hidden div contents and on clicking the android back button from the div contents page the application should exit.)
Use this code in your HTML page to handle back button pressed
document.addEventListener("backbutton", onBackKeyDown, false);
function onBackKeyDown() {
// Handle the back button
}
Try this:
function onDeviceReady() {
// Add this line to the on onDeviceReady() function
document.addEventListener("backbutton", onBackKeyDown, false);
}
// Handle back button hardware
function onBackKeyDown(e) {
e.preventDefault(); // the default action of the event e should not be triggered.
history.back(1); // load the previous window.location
}
Is it possible to capture a press and hold event of an Android Devices back button to close the app?
Cheers
Paul
yes, see the PhoneGap API:
http://docs.phonegap.com/en/1.0.0/phonegap_events_events.md.html
// Call onDeviceReady when PhoneGap is loaded.
//
// At this point, the document has loaded but phonegap.js has not.
// When PhoneGap is loaded and talking with the native device,
// it will call the event `deviceready`.
//
document.addEventListener("deviceready", onDeviceReady, false);
// PhoneGap is loaded and it is now safe to make calls PhoneGap methods
//
function onDeviceReady() {
// Register the event listener
document.addEventListener("backbutton", onBackKeyDown, false);
}
// Handle the back button
//
function onBackKeyDown() {
}
No there isn't a listener only for that but I think you can make your own long back key listener by using onKeyDown() listener or even better, you could give a try with onLongKeyDown() listener...
Good luck!