Models and Live Binding - JavaScriptMVC Forum

Loading...

JavaScript

thecountofzero

Models and Live Binding

in CanJS • 1 year ago

Let's say I am retrieving a list of player models and displaying them in a table format. Using the awesome-ness of live binding, if any attributes of a player change, that attribute will automatically be updated on the screen. Way cool stuff!

But how does it work if want to do the following:

Every N minutes I am going to go back to the server and ask for an updated list of players. When this list comes back, while it will contain most of the same player models (maybe exactly the same), they will be new instances of those models. Should I just re-render the entire view so I don't have to deal with the additions/deletions of models or is there a way for CanJS to know that this model I just got is the same as one already being displayed. Or even better, does live binding work with lists of models?

1

Replies(15)

thecountofzero

Re: Models and Live Binding

1 year ago

Advice?

daff

Re: Models and Live Binding

1 year ago

CanJS keeps a global Model store, so that there will always be only one instance of a Model with the same ID. So ideally reloading it should just update the view right away. I am not entirely sure if the converter in can.Model.prototype.model uses .attr() to update the attributes of an existing instance though, you might have to try that out. The list helper should take care of live binding the list but you will get back a different list instance so you might have to render it again anyway.

Justin Meyer

Re: Models and Live Binding

1 year ago

it should be using attr to update the properties. This was recently filed as a bug and should be fixed very soon.

thecountofzero

Re: Models and Live Binding

1 year ago

This sounds very promising.

So when models are retrieved from the server, they are stored in a CanJS global model store and when models are retrieved again from the server the global store is updated.

How are they keyed in the global store? By model type and id?

Is there a way to access the store directly?

daff

Re: Models and Live Binding

1 year ago

It is just indexed by the Model ID in a static store property for each model. You could just access it by

my.Model.store[id]

But the .model converter takes care of it as well when converting a model with the existing ID, e.g.:

my.Model.model({ id : 1 })

Will either return the stored instance for id 1 or create a new one and add it to the store.

Curtis Cummings

Re: Models and Live Binding

1 year ago

Should add that an instance will only be put in the model store if something in your app is binding to it. In the case of live binding, using attr() on any model property will bind to the instance.

thecountofzero

Re: Models and Live Binding

1 year ago

Was just about to post something similar as when I asked the store for a model with an ID that did not exist and then immediately looked at the store, I did not see the new model in there.

thecountofzero

Re: Models and Live Binding

1 year ago

I am using CanJS with Steal and am stealing the pieces I need.

Do I need to steal can/model/store for this to work?

Curtis Cummings

Re: Models and Live Binding

1 year ago

Nope, model store is in can/model and is always turned on. When part of your app binds to an instance it will be added to the store and when nothing is listening to an instance anymore, it will be removed.

I would refrain from accessing the store directly and instead use findOne, findAll and Model.Lists

thecountofzero

Re: Models and Live Binding

1 year ago

I do not ultimately plan to access the store directly, but am doing so now as I am playing with things to get a better understanding of how it all works, etc.

How do I iterate over just the attributes of a model? I thought .each would do it, but it doesn't appear so.

thecountofzero

Re: Models and Live Binding

1 year ago

Would something along these lines work for get model to use attr to update properties of a model already in the store?

model: function( attributes ) {
if (!attributes ) {
return;
}
if ( attributes instanceof this ) {
attributes = attributes.serialize();
}
var model = this.store[attributes[this.id]] || new this( attributes );
if(this._reqs){
var m = this.store[attributes[this.id]];

if(m) {
m.each( function( value, name ) {
m.attr(name, attributes[name]);
});
}
else this.store[attributes[this.id]] = model;
}
return model;
}

Curtis Cummings

Re: Models and Live Binding

1 year ago

That's the spot where the instance in the store should be updated, but you don't need to iterate over each attribute. attr() can take an object of key value pairs so you could update the instance like:

m.attr(attributes)

thecountofzero

Re: Models and Live Binding

1 year ago

Cool. I knew there was probably a simpler way.

Is such a change going to be made?

Curtis Cummings

Re: Models and Live Binding

1 year ago

Yep, I just created an issue for this and will fix it by the end of the week.

thecountofzero

Re: Models and Live Binding

1 year ago

Thanks for the fix Curtis!

© Bitovi - JavaScriptMVC Training and Support