can't update DOM

[buster]

Hello,

i've been looking into this for days and i can't get it to work, no matter what i try.

I have a Model that persists with CouchDB. Each instance contains a list of other documents, which i want to fetch and display.

So, after i load the main model from the CouchDB (everything loads and displays fine) i have the following called by the create event:

  fill: function () {
      for (i in this.model.get("pros")) {  //model contains a list of couchdb IDs in the "pros" field
        claim = $$(ClaimPro, {_id:this.model.get("pros")[i]});  
        claim = claim.load(); //this loads the document from couchdb, i can see the request going out
        this.append(claim, "ul.pros"); //this appends the "ClaimPro" model to the <ul> element(browser displays the view without the actual data from CouchDB
      }

This should load the Document from CouchDB and append it to the list. I can see that it loads, because the template of "ClaimPro" displays multiple times on the webpage. The Requests to CouchDB work fine, too, and when i put the following in the ClaimPro model i can see the correct

element in the console!

    'persist:load:success': function() {
    console.log(this.view.$root);  //this outputs the view with the correct data from couchdb, but the browser shows only the template value
    }

This outputs the correct format even with the value from CouchDB. Netherless the HTML in the Webbrowser isn't updated. Why am i doing wrong?

thanks for help and best regards!

[tristanls]

Have you tried claim.view.sync() after you load it? I haven't spent any time on the persist plugin, but that's the thing that comes to mind.

[arturadib]

Hi there, when you do a .load() immediately followed by a .append() you're assuming synchronous requests. But .load() is asynchronous so your .append() won't have the data.

I recommend either appending within the success callback, or perhaps using .gather() if you can.

Hope this helps!

-Sent from my iPhone

On Aug 4, 2011, at 7:59 AM, buster reply@reply.github.com wrote:

Hello,

i've been looking into this for days and i can't get it to work, no matter what i try.

I have a Model that persists with CouchDB. Each instance contains a list of other documents, which i want to fetch and display.

So, after i load the main model from the CouchDB (everything loads and displays fine) i have the following called by the create event:

 fill: function () {
     for (i in this.model.get("pros")) {  //model contains a list of couchdb IDs in the "pros" field
       claim = $$(ClaimPro, {_id:this.model.get("pros")[i]});
       claim = claim.load(); //this loads the document from couchdb, i can see the request going out
       this.append(claim, "ul.pros"); //this appends the "ClaimPro" model to the <ul> element(browser displays the view without the actual data from CouchDB
     }

This should load the Document from CouchDB and append it to the list. I can see that it loads, because the template of "ClaimPro" displays multiple times on the webpage. The Requests to CouchDB work fine, too, and when i put the following in the ClaimPro model i can see the correct

element in the console!

   'persist:load:success': function() {
   console.log(this.view.$root);  //this outputs the view with the correct data from couchdb, but the browser shows only the template value
   }

This outputs the correct format even with the value from CouchDB. Netherless the HTML in the Webbrowser isn't updated. Why am i doing wrong?

thanks for help and best regards!

Reply to this email directly or view it on GitHub: https://github.com/arturadib/agility/issues/44

[buster]

After patching the load method to use my success callback (it only triggers 'load:success' per default) and using this: self = this; claim = claim.load( {success: function() { self.append(claim, "ul.pros"); claim.view.sync(); } });

It didn't help. One thing i didn't mention yet, is that the model "ClaimPro" is on the "third level" (2nd subclass? I'm unsure how to call it in JS).

There is a CompanyClaims model, which gather()'s the CompanyClaim models, which themself contains ClaimPro models (my particular problem). Since CompanyClaim uses persist(.....) and ClaimPro uses persist(....) i can't use CompanyClaim.gather() because the gather method seems only be defined for empty persist() calls, right? Actually, i would want to do a CompanyClaim.gather(ClaimPro, 'append', 'ul.pros', {keys: key1, key2, key2}), for example. On the other hand, how i try to do it now seems to be straight forward (iterate over IDs, load them, append them) and i tried to dig as deep as i can and still can't see what the problem is.

thanks for you help so far, it's appreciated!

[buster]

Another way to ask:

So, now i have: Collection ---contains---> Models ---contains---> Models

Is this the correct way to use agility.js?

Or should it be Collection ---contains---> Models ---contains---> Collection ----contains---> Models

This get's quite confusing, since there is only the notion of a Model..

cheers

[arturadib]

Hi there, not sure what's going on here. I'm on vacation and might not be able to take a look at this for another 10 days or so.

I'd recommend taking a look at the The Wall demo and the persist examples on the front page and the docs.

Then create a very simple, minimal version of what you're trying to do so that you can isolate the problem.

You might also want to try and contact @quartzo or @tristanls who are also familiar with the framework.

Good luck!

-Sent from my iPhone

On Aug 4, 2011, at 9:42 AM, buster reply@reply.github.com wrote:

Another way to ask:

So, now i have: Collection ---contains---> Models ---contains---> Models

Is this the correct way to use agility.js? Should it be Collection ---contains---> Models ---contains---> Collection ----contains---> Models

This get's quite confusing, since there is only the notion of a Model..

cheers

Reply to this email directly or view it on GitHub: https://github.com/arturadib/agility/issues/44#issuecomment-1726992

[buster]

Hello,

thanks for your help so far. I think i got it working, you just have to use a "collection" (empty persist() call) in between. Now i will have to figure some other stuff out, regarding REST and CouchDB, i'm not so sure how to do pagination and partial updates of documents with the current persist API.. but anyway, i think you can close this issue now. One thing that'd be interesting to see, though: In your wall example, you have a stream class (collection) which contains several posts. How would you extend the example if each post could contain one or more comments/links/votes?

[arturadib]

Closing as this doesn't seem to be a bug anymore. Please join our mailing list for such questions: https://groups.google.com/forum/?fromgroups#!forum/agilityjs