Kogrid with server page + filtering: self.sortedData is not a function

I have a knockout and kogrid problem. After several tests, I was able to reproduce it in this fiddle:

http://jsfiddle.net/MVuUp/

Long story short, I have a sample VM (ItemsViewModel) that should provide data in a kogrid, with server-side filtering and paging. Vm provides a gridOptions object with all the data the kogrid needs and an update function called to get the data from the server. In the fiddle, I replaced the ajax call to get real data with some dummy inline data.

Now, when loading the page, I keep getting this error in the kogrid source:

Error: TypeError: self.sortedData is not a function. Source file: http://ericmbarnard.github.com/KoGrid/lib/KoGrid.debug.js Line: 1473

If instead I just use an observable array named dummyData with just a div for the grid as in the basic kogrid sample ( https://github.com/Knockout-Contrib/KoGrid ), this error doesn't appear; so my guess is that there is something wrong with my use of the library.

Here is the relevant part of my virtual machine:

function ItemsViewModel() {
    var self = this;
    self.dummyArray = ko.observableArray([{
        name: "Goofy",
        age: 27
    }, {
        name: "Mickey",
        age: 33
    }]);
    self.items = ko.observableArray([]);
    self.filterOptions = {
        filterText: ko.observable(""),
        useExternalFilter: true
    };
    self.pagingOptions = {
        pageSizes: ko.observableArray([5, 10]),
        pageSize: ko.observable(20),
        totalServerItems: ko.observable(0),
        currentPage: ko.observable(1)
    };
    self.gridOptions = {
        data: self.items,
        enablePaging: true,
        multiSelect: false,
        filterOptions: self.filterOptions,
        pagingOptions: self.pagingOptions,
        columnDefs: [{
            field: "id",
            displayName: "ID"
        }, {
            field: "title",
            displayName: "Title"
        }]
    };
    self.refresh();
}

      

        
        
        
      

    

This function is used to get data (I left filtering for now):

ItemsViewModel.prototype.refresh = function () {
var params = {
    page: this.pagingOptions.currentPage(),
    pageSize: this.pagingOptions.pageSize(),
    sortBy: "datemodified",
    isSortDesc: true
};
// dummy data (2 pages x 5)
var data = {
    page: 1,
    totalPages: 2,
    totalRecords: 10,
    records: []
};
for (var i = 0; i < 10; i++) {
    data.records.push({
        id: i,
        title: "title " + i
    });
}
ko.utils.arrayPushAll(this.items, data.records);
this.pagingOptions.totalServerItems(data.totalRecords);
}

      

        
        
        
      

    

My HTML is just a div with a data binding to

koGrid: { data: gridOptions }