In qooxdoo a setValue will always fire a 'changeValue' event even when passing '' or null.
Is this a bug or do I have to add a model to the controller first before adding listeners?
var field = new qx.ui.mobile.form.PasswordField();
field.addListener('changeValue', function () {
alert('changed');
});
field.setValue(''); //results in onchange
field.setValue(null); //results in onchange
Thanks for bringing that up. This seems like a bug to me. You can also do the following thing:
field.setValue(field.getValue());
which should never lead to a change event. Could you open up a bug report here: http://bugzilla.qooxdoo.org/
Related
I am fairly new to AngularJS and the TinyMCE editor. I was fiddling around with the keyup event available in TinyMCE when I came across this issue. In the keyup handler, I am accessing one of the controller's ng-model. Here's where things start to get odd. I printed out the ng-model value and the editor's content for comparison purposes and it would seem that the ng-model is lagging by 1 key/character behind i.e. the editor's content is the most up to date. I have a hunch that the model is updated only after the keyup event is finished. That would explain why I am seeing two values here. Perhaps I am going about this the wrong way? Speaking of which, what would be the best/correct way to access the editor's contents? Through angular or TinyMCE?
If it helps, the code looks something like this (They are placed under a single controller):-
...
this.text = "";
var viewModel = this;
this.tinymceOptions = {
setup: function (editor) {
editor.on('keyup', function (e) {
console.log(editor.getContent());
console.log(viewModel.text);
});
},
...
};
Has anyone encountered this problem before?
Thanks for the help in advance!
I'm trying to intercept a checkbox change so I can put a confirmation stage in the middle and I am experiencing strange behaviour.
When I click the checkbox preventDefault is stopping the UI from changing the checkbox, except the bound model will change once and then no longer be changeable.
Any ideas on how I can fix this? Am I approaching this wrong?
$scope.change = function(selected, $event){
$event.preventDefault();
};
https://jsfiddle.net/tcVhN/197/
edit: Answers to JB's questions below:
I am trying to intercept the checkbox change so I can put a confirmation step in the middle IE "Are you sure you want to change
this text box?"
Just updated to 1.47 (and updated jsfiddle link).
I'm using ng-click because ng-change doesn't pass the event
through which means I can't cancel the ui change via
$event.preventDefault.
See above.
I have modified your Fiddle to make it work:
https://jsfiddle.net/masa671/8qrct4y2/
Notice the change in HTML: ng-model="x.checked" to ng-checked="x.checked".
JavaScript:
$scope.change = function(selected, $event){
$event.preventDefault();
$timeout(function () {
if (window.confirm('Are you sure?')) {
selected.checked = !selected.checked;
}
});
};
The key problem for me was to find out, how to prevent the checkbox status from changing until the user has confirmed the change. I don't know the best/right solution, but I resolved this so that the event handler just prevents the default behaviour, and the actual change is handled outside the event handler with the help of $timeout.
At least the Fiddle seems to work in a sane manner... :-)
Recently I've stumbled upon a very strange code in production that is seemingly using the fact that under some conditions Angular may fire the $locationChangeStart event upon the initial page load. Moreover the next parameter value will be equal to the current value. That seems very odd to me.
I didn't find any relevant documentation for that but here is the fiddle that shows such a situation http://jsfiddle.net/tJSPt/327/
Probably the only difference is that in production we are using the manual Angular bootstrap.
Can anyone explain or point to the trustful sources of information on why is that event triggered upon the page load? Is that something we have to expect or that is just the particularity of the current Angular implementation or our way of using it?
I have experienced this recently but the reason it happened was because I'm using ui-router and the controllerAs syntax. Perhaps you are too?
I stumbled upon this link that helped me out: History should not be changed until after route resolvers have completed
I listened to the $locationChangeStart broadcast but it hit the breakpoint when I entered the state instead of when exciting.
I fixed mine by doing the following:
I listened to $stateChangeStart instead.
I had to move the code above var vm = this;
Here's my code look like after:
// ...
$scope.$on('$stateChangeStart', function (event) {
if (vm.myForm!= null && vm.myForm.$dirty) {
if (!confirm("Are you sure you want to leave this page?")) {
event.preventDefault();
}
}
});
var vm = this;
// vm.xxx = xxxx; .etc ...
I have a textarea tag with jquery.nicescroll pluggin and ng-model attached to it.
<textarea id="paper" ng-model="paper"></textarea>
In my code I apply a $watch on this ng-model variable.
$scope.$watch("paper", onTextChange);
Everything is good except that onTextChange is fired not only when I type something, but when I click away from textareaб and also when I switch to another tab.
How can I prevent it so that onTextChange is fired only when the text is changed, meaning when I type in something or delete chars?
Demo with instructions: plunker
here's a fix:
http://plnkr.co/edit/kycmUrthYU38Ukdz0jJG?p=preview
setTimeout(
function() {
$scope.$watch("paper", function(newtext, oldtext) {
if (newtext !== oldtext) {
onTextChange();
}
});
}, 100)
So the issue is that watch fires the function whenever angularjs tells the app to digest. What you did was tell it to call the 'change' function EVERY time, when you should have passed in a checker function to check the change happened. It's about 'watching', not about 'watching for changes' - the function argument is supposed to see if you need to do something.
Extra note:
AngularJS sets up watchers for all kinds of things on various elements - here's a bit more info. I believe the blur corresponds to ng-touched which triggers the digest What gets added to $scope.$$watchers by default in Angular? And what triggers $digests?
It is a bad idea to use setTimeout. Instead, you could use ng-model-options="{ getterSetter: true }" and write a method to get/set the value (Modified get/set Plunk) and handle the text change condition within this method.
obj.on('evt_A evt_B evt_c', function(eventData){
console.log("Is it possible here to find which event is triggered. As this callback is registered for three events. This callback is like a central callback for all the events on this object.")
})
obj.trigger('evt_A evt_B evt_c', [{eventDataForevt_A}, {eventDataForevt_B, {eventDataForevt_C}}])
There is one way of doing it, which is having a property in eventDataForevt_<A||B||C> which says the name of the event. But is it possible to do this without modifying the eventDataForevt_<A||B||C> ?
Check out this fiddle: http://jsbin.com/ucevov/4/edit
It doesn't seem possible to detect the event name from your obj.on - note that evt_c in this._events is true even when evt_c is not called.
However there is a special "all" event which passes in the name of the calling event as the first parameter, so
obj.on("all", function(eventName, eventData) {
console.log(eventName);
});
should output the name of the event that was called.