Derik Whittaker

Syndication

News


How to make non-observable properties observable in Knockout.js

I am working on a project which is using Knockout.js to give us MVVM style binding between our data model (view model) and our views.  We are also MVC4 and Web API.  This means that my ViewModels will be making calls in to our Web API endpoints to get json back.  When we receive this json back we are using the property from the resulting json to bind to our UI.  This works great in a read-only scenario, but what happens when I want to update my UI via binding?

If you need to update the values AFTER the initial binding you have 2 choices (there may be more but these are what I know)

1) You can create a new property, mark it as being observable, and set the original value from the json result as the seed value in your new property.

item.newProperty = ko.observable(item.OriginalProperty)

2) You can simply overwrite your original property as make it observable (gotta love how javascript is dynamic, right)

item.(item.OriginalProperty) = ko.observable(item.OriginalProperty)

In my opinion option 2 is the way to go, I feel it is a bit cleaner and ‘it just works’

Thoughts?

Till next time,


Posted 12-15-2012 12:52 PM by Derik Whittaker

[Advertisement]

Comments

Rob Eisenberg wrote re: How to make non-observable properties observable in Knockout.js
on 12-15-2012 2:11 PM

Two is definitely simpler. However, bear in mind that this changes it from a property to a function. So, if other parts of the system are relying on it being a standard JS object, then they will fail when they try to access the the property incorrectly. It's a tricky situation. I really like knockout, but I really wish it didn't force you to make everything a function. As your application grows in size...it becomes a pretty serious maintenance issue since you have to remember which object have function for properties and which don't...or worse, on a give object, which properties are observable and which aren't.

Kris Ivanov wrote re: How to make non-observable properties observable in Knockout.js
on 12-15-2012 11:57 PM

You should look into KnockoutJS mapping plugin. It solves the problem you are described: knockoutjs.com/.../plugins-mapping.html

Mathieu wrote re: How to make non-observable properties observable in Knockout.js
on 12-18-2012 4:52 PM

Sorry but do you mean?

item.OriginalProperty = ko.observable(item.OriginalProperty)

buy viagra online wrote re: How to make non-observable properties observable in Knockout.js
on 02-02-2013 12:30 PM

zTGiJv Im thankful for the blog post.Really thank you! Really Cool.

buy viagra wrote re: How to make non-observable properties observable in Knockout.js
on 02-03-2013 8:35 AM

R4WBQU Thanks for sharing, this is a fantastic article post. Much obliged.

buy discount viagra wrote re: How to make non-observable properties observable in Knockout.js
on 02-03-2013 2:22 PM

r2cybH I truly appreciate this blog post.Thanks Again. Really Cool.

buy discount viagra wrote re: How to make non-observable properties observable in Knockout.js
on 02-03-2013 3:11 PM

eFvW74 I cannot thank you enough for the post.Thanks Again. Great.

About The CodeBetter.Com Blog Network
CodeBetter.Com FAQ

Our Mission

Advertisers should contact Brendan

Subscribe
Google Reader or Homepage

del.icio.us CodeBetter.com Latest Items
Add to My Yahoo!
Subscribe with Bloglines
Subscribe in NewsGator Online
Subscribe with myFeedster
Add to My AOL
Furl CodeBetter.com Latest Items
Subscribe in Rojo

Member Projects
DimeCasts.Net - Derik Whittaker

Friends of Devlicio.us
Red-Gate Tools For SQL and .NET

NDepend

SlickEdit
 
SmartInspect .NET Logging
NGEDIT: ViEmu and Codekana
LiteAccounting.Com
DevExpress
Fixx
NHibernate Profiler
Unfuddle
Balsamiq Mockups
Scrumy
JetBrains - ReSharper
Umbraco
NServiceBus
RavenDb
Web Sequence Diagrams
Ducksboard<-- NEW Friend!

 



Site Copyright © 2007 CodeBetter.Com
Content Copyright Individual Bloggers

 

Community Server (Commercial Edition)