disable mobile back button in phonegap[ and jquery mobile - javascript

I developing a app using phoneGap and jQueryMobile. For this I am using in app browser. Its work properly except one issue. when I open app it goes to login page. After login I click mobile back button it goes to login page but it should not happen. similarly if I browse multiple pages and want to exit then it moves one by one pages so its not close my app by clicking single back button.
So to fix this issue i used hashcode in url. Now it disable back button but my jQueryMobile pop not working because its work on hash in url.
Please suggest how to fix this.
Either suggest a method to disable back button without using hash code or open popup if hashcode used.

To disable hard backbutton use the following code
document.addEventListener("backbutton", onBackKeyDown, false);
function onBackKeyDown(e) {
e.preventDefault();
}
Or you can do page back navigation in OnBackKeyDown method as follows
function onBackKeyDown(e) {
history.go(-1);
navigator.app.backHistory();
}

Related

Custom Event for Android Back button in PWA

I am working on a PWA and I have a page with a full screen modal in it, which pops up upon a button click to perform a specific action.
On the modal I have a close button tied to a function which works fine in closing the modal. However I noticed that on most native apps, when a modal is active clicking the (android) back button in a UI like mine closes the modal instead of going to the previous view.
My concern is if it were possible to listen to the android back button being clicked, prevent the default action and call another action. Or if there's anyway else around this!
I've made researches but all I can see is handling the browser back button, which in my case does not work. Tested on samsung A30,S10,A50.
From the Suggested question which I had gone through, There's no answer concerning how to handle the back button, Only on how to intercept it. And none of those answers my question.
Kindly note, PWA is already installed, hence in standalone mode
There is no way to handle the back button of Android in the PWA environment.
It is a system button which "clicks" the history.back() of an open browser. If there is no back-history it closes the browser.
But it doesn't know anything about this special button. There would be the need for something like the keypress-events. But there is no standard and so no implementation in the browsers.
The only way to handle this stuff in your app, is to manage the history.state in your app.
Push a new state with opening the modal. And close the modal in the popstate-event.
https://developer.mozilla.org/en-US/docs/Web/API/History_API/Working_with_the_History_API

Javascript - Prevent Back Button Android From Exit Browser

I have angular single app page application website not cordova, ionic etc., pure javascript and when I enter to the link, I would like to prevent user from press back button. The user will be able to close the browser by pressing home button.
Is it possible in javascript?
Thanks.
You can try document.addEventListener('backbutton', function(e) {e.preventDefault();}) to disable the back button.

Detect 'Allow app to launch' Window JavaScript

I am developing a SharePoint App that basically launches a form in a Windows 8 application once the action is clicked. This is working perfectly fine. However, once you select this action, you are redirected to a page that basically holds some parameters to launch the app. This page throws a window that asks the user if it's okay to launch the app:
How can I detect if this has been launched or not? Ultimately I'd like to detect if the user hits 'Allow' or 'Cancel' but either scenario will work. I am trying to redirect a user to the parent page once this window has launched (hopefully when the user clicks 'Allow'
Is this possible? I found a helpful thread here: http://support.smartbear.com/viewarticle/55730/
However, this thread is very useful but doesn't give me the answer I need. I've tried using jQuerys .blur and this works(ish). It isn't giving me a consistent response but looks like it's a step in the right direction (if I can't detect the window that launches). I've also tried the following code by using .hover but am receiving inconsistent results.
$(window).hover(function (event) {
if (event.fromElement) {
console.log("inactive");
window.location.href = "http://google.com";
}
else {
console.log("active");
}
});
At the highest level possible, I'm trying to redirect the user once the app is launched.
Thanks in advance for any helpful input.

Exiting apps in HTML5 &Jquery Mobile

I am trying to create a mobile webapp using HTML5 and JqueryMobile. I want to use one Exit button on which the app should be exited. I already tried window.close() and self.close().
That is not working.
Or it will be okay...back button of device automatically handles the exit option of app?
Anyone have idea about this?
On Android you can use...
navigator.app.exitApp();
As far as I'm aware, iOS does not offer a way to programmatically exit an application.
But really, you don't need an exit button. The devices that the app will run on all have home and/or back buttons, which are the correct way to "exit" apps. Let the OS decide what to do with it, not the user.
Back button is used in navigation so it will just navigate you to previous page in your web view.
You need to handle it yourself in back button handler and call
navigator.app.exitApp()
when you need to exit app.
You can add back button handler with command:
document.addEventListener('backbutton', backbuttonHandler, false);

phonegap back button requires 2 taps

I am using PhoneGap 2.9 on a Galaxy S3 Android 4.2.1 to develop an application. In the application i have overridden the default back button behavior. The back behavior is simply a call to :
window.history.back();
I have 4 html pages. After navigating all the way to page4.html, I hit the back button and successfully navigate to page3.html. On page3.html I must hit the back button twice in order to successfully navigate to page2.html. It seems to behave this way regardless of the navigation plot. The first "back" works fine, all subsequent ones require a double tap of the back button.
Stangely, when I put an alert("going back!") just before the call to window.history.back(),it displays properly for every "back" tap in the navigation. What could be causing this?
I'm not exactly sure how you are calling window.history.back() but you could do something like this:
$("#backButton").bind("click", backClicked);
function backClicked(){
window.history.back();
}
and I highly recommend incorporating the fastclick.js library to any project that you want responsive buttons.

Categories