backbone.js - my Backbone Collection does not display the change in model -


i have collection of items(books). each item displays button updates attribute (due date) of corresponding item.

item-list:

  1. [button] item 1 [monday]
  2. [button] item 2 [monday]
  3. [button] item 3 [tuesday]

for example, if click button on item 2, maybe server answers 'tuesday' , models attribute 'tuesday'.

the problem see change if press refresh button on browser.

var itemview = new bookcollectionview({collection: items});                     itemview.listento(items,'change',itemview.render);                     self.$el.append(itemview.render().el);   

that how initialize list in main window. set of collection looks this:

    var bookcollection = backbone.collection.extend({      defaults: {         user:null,         token:null     },      initialize: function(options){         this.user = options.user;         this.token = options.token;     },      comparator: 'item',     model: bookmodel,      parse: function(data) {         return data.xx;     },  });    var bookcollectionview = backbone.view.extend({     events: {         "click .btn-extend" : "renewbook"     },      initialize: function(){     try{         _.bindall(this, 'fetchsuccess', 'fetcherror', 'render', 'renewbook');         this.template = rendertmpl('booklist');         this.collection.fetch({             success: this.fetchsuccess,             error: this.fetcherror         });     }catch(err){console.log("error:bookcollectionview");}     },      fetchsuccess: function() {         this.render();     },      fetcherror: function() {         throw new error('error loading book collection');     },      render: function(){         this.$el.html(this.template({collection: this.collection.tojson()}));         this.$el.trigger("create");         return this;     },      // renew book when button clicked, calling model's "renew()" function     renewbook: function(e){         console.log("you clicked button!");         e.preventdefault();         //each button got unique id fetch here , use find model. inside collection-template, per convention,         //the id="<%= book.buttonid %>" string, have used integer model's buttonid attribute. parse integer.           var id = $(e.currenttarget).attr("id");         this.collection.findwhere({"buttonid": parseint(id)}).renew3();     } }); 

edit: here book model

    var bookmodel = backbone.model.extend({     defaults: {         status: null,         item: null,         edition: null,         about: null,         label: null,         queue: null,         renewals: null,         reminder: null,         starttime: null,         endtime: null,         cancancel: null,         canrenew: null,         htmltag: "?",         colorrgb: [1,66,96],         daysleft: null,         buttonid: null,         buttondisabled: null,     },      url: function(){         return server+app.session.get('x.session.patron')+"/renew?access_token="+app.session.get('x.session.token');     },      initialize: function(){         this.setup();     },      setup : function(){         //give each book unique button renewal         if(this.get("about")!=null) {this.set("buttonid",giveid());}          if(this.get("canrenew") && this.get("queue")==0){   this.set("buttondisabled", [1,66,96,207,218,227]); }         else {                                              this.set("buttondisabled", [188,199,205,222,227,231]); }          this.daysleft(this.get("endtime"));          if(this.get("daysleft")<=0){                  this.set("htmltag","late");             var badvalues=[255,0,0];             this.set("colorrgb",badvalues);             alert("a1");         }         else{             if(this.get("daysleft")<=3 && this.get("daysleft")>=0){                 this.set("htmltag","due soon!");                 var sosovalues = [250,190,0];                 this.set("colorrgb",sosovalues);                  alert("a1");             }             else{// wenn buch ok, set color green                 this.set("htmltag","o.k.");                 var goodvalues = [80,190,0];                 this.set("colorrgb",goodvalues);             }         }     },      renew3: function(){         if(this.get("canrenew") && this.get("queue")==0){             this.fetch({                 data: json.stringify({                         "doc":[                             {"edition":this.get("edition")},                              {"item":this.get("item")}                         ]                 }),                 datatype: 'json',                  type:'post',                 contenttype:'application/json'             }).then(function () {                 this.setup();                 alert("a1");                         });          }         else{             alert("a1");             }     },      // calculate # of days until book has returned library     daysleft : function(date){         try{             var = moment(date);             var b = moment();             this.set("daysleft",a.diff(b, 'days'));         } catch(err){console.log("error occured during daysleft calculations");}     },   }); 


Comments

Popular posts from this blog

ubuntu - PHP script to find files of certain extensions in a directory, returns populated array when run in browser, but empty array when run from terminal -

php - How can i create a user dashboard -

javascript - How to detect toggling of the fullscreen-toolbar in jQuery Mobile? -