The default in Onsen is that the app closes/exits when the device backbutton is pressed. Is there any way to control that in Onsen to also mimic the ons-navigator action/page history?
Thanks!
In case of PhoneGap/Cordova, backbutton event is fired when the backbutton is pressed.
Therefore, you can set the eventhandler s.t.
document.addEventListener("backbutton", onBackKeyDown, false);
In eventhandler function, you can call popPage method of navigator by obtaining the navigator scope s.t.
function onBackKeyDown() {
// Handle the back button
alert("Backbutton is pressed!");
var element = document.querySelector( ".navigator-container");
var scope = angular.element( element ).scope();
scope.popPage();
}
If you are using Monaca, the hybrid application framework based on Cordova, the backbutton event
is not fired. Instead that you can use the .ui file in which the Backbutton event is defined s.t.
{
"event" : {
"onTapBackButton" : "onBackKeyDown();"
}
}
No need to handle backbutton event to prevent application being killed.
Onsen-ui Added support to android back-button on ons-navigator and ons-sliding-menu from v1.1.1.
You can check here
You can controll it with "disableDeviceBackButtonHandler" after ons.ready event. After that add a event listener for back button and do anything you want.
ons.ready(function() {
ons.disableDeviceBackButtonHandler();
// Use Cordova handler
window.document.addEventListener('backbutton', function() {
// Handle backbutton event
}, false);
});
Just check this article: https://onsen.io/guide/overview.html#HandlingBackButton
Related
I am using fullpage.js for my website's home page an di open one modal over it, but when i open modal and scroll then home page is scrolling. I solve that issue by using
$(document).on('click', '#turnOff', function() {
$.fn.fullpage.setAllowScrolling(false);
$.fn.fullpage.setKeyboardScrolling(false);
});
$(document).on('click', '#turnOn', function() {
$.fn.fullpage.setAllowScrolling(true);
$.fn.fullpage.setKeyboardScrolling(true);
});
now, it works fine... but on every 'mouseWheel' event it shows error as below.
[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive
You can use the event Callback onLeave(direction) of FullPageJs:
...
onLeave: function(origin, destination, direction){
var leavingSection = this;
if(origin.index == 1 && direction =="down"){
alert("Going to section 3!");
}
else if(origin.index == 1 && direction == "up"){
alert("Going to section 1!");
}
}
...
CallBack
How to capture the iCheck change event in backbone view.
I am unable to find any reference and using normal change event is not working.
My solution for events backbone.js is
events: {
'ifChanged #myIdCheckbox': 'changed'
},
First of all, you should try to search on the Internet almost all plugins have a web page, this one for example: http://icheck.fronteed.com/
But anyway, to listen to click event Ichecks, you must use ifChanged or check
$('input').on('ifChanged', function (e) {
var value = $(this).val();
....
});
You can also use an ID to select a checkbox just by typing: $('#Id').....
I'm using the angular leaflet directive. Everything is working properly on my laptop. But on iPad, the double click is working but the click event is not working at all. I have one event handler for click but it doesn't get triggered.
$scope.events = {
map: {
enable: ['mousedown', 'dblclick', 'click'],
logic: 'broadcast'
}
};
$scope.$on('leafletDirectiveMap.mousedown', function(event) {
alert('click');
});
$scope.$on('leafletDirectiveMap.click', function(event) {
alert('click');
});
$scope.$on('leafletDirectiveMap.dblclick', function(event) {
alert('dbclick');
});
Double click event gets triggered but the other ones not. Anything I can try to debug this?
checkout this https://github.com/angular/material/issues/1300.
Having this below code fixed that issue for us,
$mdGestureProvider.skipClickHijack();
I can successfully add a listener to the painted event in the view for a selectfield. But, how do I do this in the controller?
control: {
"#form #field": {
painted: 'onPainted'
}
}
// omitted onPainted method that logs message in console
This doesn't work. However, directly adding a listener in the view works.
// in the view for the selectfield (works)
listeners: {
painted: function() {
console.log("Painted");
}
}
What am I missing?
From a comment in the docs:
This event is not bubbled up to the controller, "for performance reasons".
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.