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
}
Related
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');
}
I'm developing a app using angularjs and ionic framework. It has a logout option also. When i logout from my app it goes straight to the home page.But if i press the back button it'll go to page that can be accessed only if you are logged in. How can i create a option to close the app if you press the back button from the home page? I use angularjs.
I used this way but did not work
document.addEventListener("backbutton", function(e){
if($.mobile.activePage.is('/templates/playlists')){
/*
Event preventDefault/stopPropagation not required as adding backbutton
listener itself override the default behaviour. Refer below PhoneGap link.
*/
//e.preventDefault();
navigator.app.exitApp();
}
else {
navigator.app.backHistory()
}
}, false);
Your code is good.
But, I'm not sure about the second line : are you sure that the active page id is /templates/playlists ?
Normally, the value you should pass to the $.mobile.activePage.is function should contain a page id (which could be retrieved like this : $.mobile.activePage.attr('id')).
(by the way, I don't know which of jQuery Mobile you are using, but the $.mobile.activePage.is was deprecated).
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);
I have disabled the back button in menu.html page. Using this
i have successfully quit my app on pressing back button on phone.
But this causes back button not working on any other page.
function onDeviceReady() {
document.addEventListener("backbutton", onBackKeyDown, false); //Listen to the User clicking on the back button
}
I want to navigate to Menu.html page when cliked on back button on phone. I have tried this but failed.
function onBackKeyDown(e) {
e.preventDefault();
navigator.notification.confirm("Are you sure you want to go to Menu page?", onConfirm, "Confirmation", "Yes,No");
// Prompt the user with the choice
}
function onConfirm(button) {
if(button==2){//If User selected No, then we just do nothing
return;
}else{
window.loacation="menu.html";// Otherwise navigate to Menu Page
}
}
how can i link to menu page when cliked on back button?
try to use window.location.replace("menu.html")
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.