In my Backbone application, I have a view that renders when a collection is reset. I am fetching data from the server and resetting the collection with this fetched data. However, I'm facing an issue where the values I retrieve from the server are showing up as null in the view.
initialize: function(options) {
this.options = options;
this.model.get('projects').fetch({
data: {
organisation_id: this.model.get('id')
}
}, {reset:true});
this.model.get('projects').on('reset', this.render, this);
this.model.get('projects').on('add', this.addNewProject, this);
this.model.get('projects').on('sort', this.addProjects, this);
},
render: function() {
console.log(this.model.get('projects').state);
this.$el.html( this.template({
is_owner: this.options.is_owner,
className: this.options.className,
pagination: this.model.get('projects').state
}));
this.addProjects();
this.filter = new Pops.Views.OrganisationProjectsFilter({
el:this.$el.find('.div-organisation-filter-wrapper'),
model : this.model,
collection: this.collection
});
this.filter.render().el;
return this;
},
I've defined a PaginatedProjects collection for handling paginated data. This collection fetches data from the server and initializes pagination states. Despite successfully parsing the data in the collection, when I try to access these values in my view, they seem to be null.
App.Collections.PaginatedProjects=
Backbone.PageableCollection.extend({
url: App.API_ROOT + "/projects/paginated",
// Initial pagination states
state: {
pageSize: 2,
sortKey: "name",
order: 1,
totalRecords:null
},
// You can remap the query parameters from `state` keys from
// the default to those your server supports
queryParams: {
totalPages: null,
totalRecords: null,
sortKey: "sort",
},
// get the state from Github's search API result
parseState: function (resp, queryParams, state, options) {
this.state.totalRecords = resp.total;
this.state.totalPages = resp.total / this.state.pageSize;
this.state.lastPage = this.state.totalPages;
},
// get the actual records
parseRecords: function (resp, options) {
return resp.data;
}
});
After running the parse functions on the collection, I see the correct values when I log them. However, these values appear as null when I try to use them in my view. Am I incorrectly using parse or reset functions, or perhaps both?