CODEWITHSUNDEEP
javascripthtmlknockout.jsodatajaydata
Shlomo Arieh
Shlomo Arieh

Reputation: 35

Pull-to-refresh with Knockout and JayData

I'm developing HTML5 app with Knockout.js and JayData and I encountered a problem while implementing a pull-to-refresh data list.

I query a remote OData service with JayData API and assign the results to a KO observable array:

db.MySet
  .orderBy('it.Field1')
  .skip(recordsToSkip)
  .take(20)
  .toArray()
  .then(function(result) {
     self.MyDataList(result);
  }

I always lose the old records. How could I fix my code?

Upvotes: 1

Views: 381

Answers (2)

Robesz
Robesz

Reputation: 1646

I guess there is a small thing missing while bindig the result to the Knockout observable: check if the existing array already contains elements and append the result to the existing ones.

My colleague Viktor has a tutorial, which implements a highscore list with Knockout+JayData pull-to-refresh

db.MySet
  .orderBy('it.Field1')
  .skip(recordsToSkip)
  .take(20)
  .toArray()
  .then(function(result) { 
     if (result.length){
       if (self.MyDataList().length){
            self.MyDataList(self.MyDataList().concat(result));
       }else{
            self.MyDataList(result);
       }
    }
   });

Does this fix the app? The full context of the example can be found on GitHub

Upvotes: 1

Cerbrus
Cerbrus

Reputation: 72907

You will need to concatenate your new array of objects to your old list:

.then(function(result) {
    oldList = oldList.concat(result);
    self.MyDataList(oldList);
}

(So, on the first run, you will need to set oldList = [])

Upvotes: 1

Related Questions