We were unable to load Disqus. If you are a moderator please see our troubleshooting guide.
The owner key is one way to make sure that the read/write functions run under the right context, as mine currently depend on "this" being the correct object. Normally, I would pass the target in as the second param to ko.dependentObservable, but in current KO code the second param is ignored if it recognizes that the first is an object instead of a function.
Otherwise, you could call .bind(this) after each function or do a "var that = this;" and use "that" in the read/write functions. The owner flag is just one option and at least it is explicit.
Good idea! I have multiple places with .bind(this). Now I'm going to use your solution.
Thanks!
BTW, I'm using KO from last July, and I do enjoy your participation in knockoutjs list... Thanks for your answers - they're always useful.
Nice article.
How to do "update" reaction for data imported by mapping from JSON?
How to get access to old/new value and made update reaction 1 for value Up, and reaction "2" for value Down?
Thank you ;-)
You can use manual subscriptions against your observables to perform some action when they are updated even by mapping plugin. The function that you use will receive the new value as its first argument and you can react based on it.
Otherwise, here is a sample of a "change tracker" in KO: http://jsfiddle.net/rniemey...
var Day = function(){
this.items= ko.observableArray([]) //meal plans
}
Day.total = ko.dependentObservable({
read: function() {
return this.items().length;
},
deferEvaluation: true
}, Day);
Day is a nested element of the main ViewModel (ViewModel contains days and a day contains a list of meal items)
However this does not work as expected. Where am I missing?
@Anonymous - in 1.21 and earler, the second parameter to a dependentObservable is ignored when the first param is an options object. So, what you can do is use the "owner" property rather than the 2nd param. It would look like:
Day.total = ko.dependentObservable({
read: function() {
return this.items().length;
},
deferEvaluation: true,
owner: Day
});
This has actually been changed for 1.3 and it will respect either (with the "owner" option winning, if both are specified).
How can we implement fade effect to newly added row?
@ozz here is a sample using the afterAdd callback of the template binding to fadeIn each row: http://jsfiddle.net/rniemey...
Clever solution Ryan. How can we achieve it without template? using commented ko foreach:items,afterAdd:fadeIn or data-bind="afterAdd:fadeIn" at first element does not work.
If you are using foreach, then you can do it like data-bind="foreach: { data: items, afterAdd: fadeIn }"
Thanks a lot Ryan. It works. Best regards..
if i want to fire and ajax call everytime an input is change do i have to subscribe every observable?
@DevNewbie you could consider a technique like this: http://www.knockmeout.net/2... where you create a computed observable that has a dependency on all of your fields and then subscribe to this flag and fire your AJAX whenever it changes.
This little plugin creates a reactor for any subscribable or child subscribables at once:
https://github.com/ZiadJ/kn...
I'm not sure if it's the best way to go but it helped me out a lot in similar scenarios before.
Very nice!
How would you total the totals?
Another way to track changes is actually bind the onchange event. It gives you a lot more information to work with. I had a nested model, and I tried to "subscribe" to when a user changed a value in select, but that only gave me a string for the new value. onchange, gave me the parent model object and the sending control, and that really allowed me do what I needed to.
Any ideas why a subscribe would not fire? It's weird, I created a fiddle and it works, but it doesn't work in my production application, and I need to do something when the Country drop down changes. Could the order of functions in the view model make the difference? I've moved things around trying to get it to fire, and nothing. Any thoughts?
https://jsfiddle.net/kahanu...
Nevermind! 8^D I found what I did. Did I mention I have the IQ of an ice cube?
King Wilder glad you found it!
Is there a lifetime to a subscription? If I toggle between the display view of some data, and the edit view of that data (in the same HTML, but using a boolean to show or hide sections), when I go to the edit view, the subscription works on a drop down field, so other fields change as they should. If I toggle back to the display view, and then back to the edit view, the subscription is no longer active. Does it destroy itself after first use?
King Wilder I think that I helped you with this problem through email, but subscriptions are alive until dispose is called on them. In your case, it looks like your subscription was against an observable on an object that was replaced with a new copy.
Why the owner key on writable dependent observable?