jeromegn / Backbone.localStorage

A localStorage adapter for Backbone.js
MIT License
1.89k stars 681 forks source link

how to fetch collection from localstorage ?? #188

Closed ashishsajwan closed 7 years ago

ismnoiet commented 8 years ago

A good question, me too i was looking for the an answer, and after a little bit of tweaking i found out this:

// Let's say the name of the localStorage item is myData inside the collection 
// localStorage attribute.
var Collection = Backbone.Collection.extend({
    model:Model,        
    localStorage: new Backbone.LocalStorage("myData")
});

// now you have access  to myData localStorage item 
console.log(localStorage.getItem('myData');

// Now what you get from the previous instruction is an array of IDs representing
// the IDs of models inside the myData collection

//Now the key for each model inside the local storage is :
// collectionName + '-' + id(an element of the array localStorage.getItem('myData'))

// all models are stored in the one string joined by ','
var firstModel = localStorage.getItem('myData-'+localStorage.getItem('myData').split(',')[0]);
console.log(firstModel); // now you get the first model logged out to the screen 

// Note here that each Model id is the same one stored inside
// the array localStorage.getItem('myData')

// Here is a simple example without too much talking :

var LOCALSTORAGE_NAME = 'myData';

var collectionOfIDs = localStorage.getItem(LOCALSTORAGE_NAME);
    collectionOfIDs = collectionOfIDs.split(',') // because ',' is used to join model IDs in a single string stored in the variable collectionOfIDs 

var models = collectionOfIDs.map(function(modelID){
    return localStorage.getItem(LOCALSTORAGE_NAME + '-' + modelID);
});

console.log('models stored under the collection myData are : ',models);

Hope this helps and have a nice day :)
ismnoiet commented 8 years ago

You can check my fork for the Real world example as it is not yet an accepted PR https://github.com/ismnoiet/Backbone.localStorage

in the README file

absolux commented 8 years ago

As simple as

var Collection = Backbone.Collection.extend({ localStorage: new LocalStorage('todos') })
var todos = new Collection
todos.fetch() 
ismnoiet commented 8 years ago

Thank you @absolux for the direct answer, but if you want really to know how collection items are stored in the localStorage then my solution is here to show you how they are exactly stored in the there, you can also play around with it and see what you get :)

absolux commented 8 years ago

Thanks @ismnoiet for reply. But, why should we direct access localStorage global object instead of the Backbone collection ?

ismnoiet commented 8 years ago

@absolux Good question, my answer is for curious people who want to learn how things are stored, otherwise your answer is the direct one and should be used for real world usage. Because sometimes you need to implement something like backbone collection with your own javascript framework or even just with your javascript code. for short use my solution to learn about real world implementation and your solution if you just need to use it and that's it :). Hope this is a clear answer.

scott-w commented 7 years ago

Hi guys,

Thanks for contributing this. I'll be updating the code to ES6 + modules soon which should make the implementation a little more obvious.

Regards, Scott

adabonyan commented 5 years ago

I have just read this while struggling with how to permanently delete models in local storage. How can I achieve this as all the tricks I can think of failed.

scott-w commented 5 years ago

Hi Olu,

Does the usual model.destroy() not do what you need?

On Thu, 11 Apr 2019 at 00:52, Olu Adabonyan notifications@github.com wrote:

I have just read this while struggling with how to permanently delete models in local storage. How can I achieve this as all the tricks I can think of failed.

— You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub https://github.com/jeromegn/Backbone.localStorage/issues/188#issuecomment-481913828, or mute the thread https://github.com/notifications/unsubscribe-auth/AB4PEakxQC5uutEu3WRDuq9MRaW4W01pks5vfnlDgaJpZM4F0DUn .

-- Scott Walton