Hey everyone, I've been working on a Backbone application that involves adding and deleting or editing images. Currently, I'm using a router to navigate between different sections like the gallery and forms. However, whenever I make changes in the gallery section and switch back to the forms section, I don't see the updated data - only the old information. I have to manually refresh by pressing CTRL+F5 to see the changes, which is not ideal.
I've tried using .clear and .reset but while they reset the collection and model, they don't affect the data inside the collection. Can someone please help me figure out what I'm doing wrong?
Here's the code for the Collection and Model:
var GalleryImage = Backbone.Model.extend({});
var GalleryImages = Backbone.Collection.extend({
model: GalleryImage,
url: '######',
initialize: function() {
this.reset();
if(this.reset()) {
console.log("model reset", GalleryImage.cid);
} else {
console.log("model not set");
}
this.on("reset", this.loadImagesView, this);
this.on("error", this.errorMessage, this);
},
loadImagesView: function() {
if(!this.CollView) {
this.CollView = new GalleryImagesView({collection:this});
}
this.CollView.render();
},
errorMessage: function() {
jQuery('#imageBlocksDiv').html('<span id="noMsg"><h4>No images to display.</h4></span>');
}
});And here's the code for the router:
initGallery: function() {
jQuery('#invset').hide();
// More code here...
},
// Other functions and code snippets...
In addition, I have a section where users can click on images to add details, and the changes get saved in Parse. However, when users return to the image later, they see the older positions and outdated information instead of the updates. I believe the issue is similar for both scenarios, so a solution for one might work for all. Any help would be greatly appreciated. Thank you in advance.
Thank you,
Santosh Upadhayay