I have the following code which is supposed to prevent the back button from exiting the app and just show an alert. The alert comes up but after i hit "ok", it still exits the app. I have no idea why the preventDefault isn't working.
document.addEventListener("backbutton", onBackKeyDown, false);
function onBackKeyDown(e) {
e.preventDefault();
alert('Back Button is Pressed!');
}
Related
I have a React application with a form component.
When a user fills in the form and tries to navigate away from the page in any way (closing tab, closing browser, refreshing page, pressing browser back button or any other navigation), I want to alert the user of unsaved changes.
I did the following -
useEffect(() => {
// do something
window.addEventListener("beforeunload", function (e) {
e.preventDefault();
e.returnValue = "";
});
return () => {
window.removeEventListener("beforeunload", function (e) {
e.preventDefault();
e.returnValue = "";
});
};
}, []);
This works when I try to close the browser, close tab or refersh the page. But when I press back button, I do not get any alert.
Is it that I cannot capture that back event due to security reasons? (FYI I am using Brave browser).
If I can, what am I doing wrong here?
you can try to subscripe onhashchange event.
Here is thread with a similar query:
How to Detect Browser Back Button event - Cross Browser
Here I'm Using md-dialog box prompt() method of angular- material so after clicking OK button it returns promises where .then's resolve function (the first parameter) is when .hide() is called and the md-dialog box disappear.
Can anyone please suggest me how can I resolve function without calling .hide() method.
Here is my code.
$scope.parentNumberOTPVerification = function(ev,name,mobileNumber,email) {
// Appending dialog to document.body to cover sidenav in docs app
storeService.otpSender(name,mobileNumber,email)
var confirm = $mdDialog.prompt()
.title('Please Provide Your OTP')
.placeholder('OTP')
.targetEvent(ev)
.ok('Verify')
$mdDialog.show(confirm).then(function(result) {
//console.log("result:",result)
}, function() {
$scope.status = 'You didn\'t name your dog.';
});
};
so what i want when i'm hiting ok button of the dialog box first function execute and dialog box hide. have there any way to stop that hidding?
In mobile safari browser, sometimes when i click on goggle places options dropdown that doesn't work. So basically i select and the dropdwon closes but nothing appears in input.
I tried this solution also :
$timeout(function () {
var container = document.getElementsByClassName('pac-container');
// disable ionic data tab
angular.element(container).attr('data-tap-disabled', 'true');
// leave input field if google-address-entry is selected
angular.element(container).on("click", function(){
document.getElementById('autocomplete').blur();
});
}, 500);
}
}
But it doesn't work. Sometimes the selection works fine but not all time
I am using ionic to develop hybrid mobile app. My app contains loading app (load.js) and core app (core.js). When the app first boot up, it will load load.js and show the login screen. Once user login, it will connect to the server and load core.js. These 2 JS are running independently and can't communicate directly. load.js is only use on startup, after that it is "sleeping" at the back.
This kind of method works great and fine, except with the hardware back button. If the load.js is loaded with ionic, then when user click on hardware back button, the app will exit instantly. I tried with $ionicPlatform.offHardwareBackButton(), but didn't work.
So, is there a way to remove hardware back button on load.js without removing ionic from it?
This is the service I use to disable the back button:
https://gist.github.com/mircobabini/689955216a036544d594
.service( 'HardwareBackButtonManager', function($ionicPlatform){
this.deregister = undefined;
this.disable = function(){
this.deregister = $ionicPlatform.registerBackButtonAction(function(e){
e.preventDefault();
return false;
}, 101);
}
this.enable = function(){
if( this.deregister !== undefined ){
this.deregister();
this.deregister = undefined;
}
}
return this;
})
// usage
.controller( 'YourController', function( 'HardwareBackButtonManager' ){
HardwareBackButtonManager.disable();
// re-enable it when you want,
HardwareBackButtonManager.enable();
})
Developing a BackboneJS app with pushState
When user clicks the mouse's back button or clicks the browser's back button, how can I capture the event and do something like:
backAction: function(e){
if (someConditionIsTrue) { preventBackAndDoSomeStuff(); }
else { doNormalBackEvent() }
}
You can add a listener to window.onpopstate to get notice when the user hits the back button.