0

I am trying to figure out how to store dynamically created list elements in local storage with the key/value pair system, but cannot figure it out...

I have a list of bars which can be added to a 'favorites' list by click a star on the individual bar's page and having the particular list element cloned and then appended to the favorites list.

I can't figure out how to store this information using local storage...

This is the JS using Jquery toggling a class, swapping an image and then cloning and appending to the #favorites ul

$("document").ready(function() {

$('#club1668Star').toggle(club1668Blue, club1668White)

function club1668Blue(evt) {
    $('#club1668Star').toggleClass('club1668Blue').attr("src", "media/images/bluestar40.png");
    $("#barlist li[id=club1668List]").toggleClass('club1668Fav');
    $("#barlist li[class=club1668Fav]").clone().appendTo("#favourites ul[class=plasticBar]");

}

function club1668White(evt) {
    $('#club1668Star.club1668Blue').removeClass('club1668Blue').attr("src", "media/images/whitestar40.png")
    $("#barlist li[class=club1668Fav]").toggleClass('club1668Fav');
    $("#favourites ul[class=plasticBar] li[id=club1668List]").remove();
}

});

any help would be greatly appreciated...

cheers, mark

user482024
  • 95
  • 1
  • 2
  • 12

2 Answers2

1

There's a well-known way to pass multiple JS objects as a single value, it is called JSON. Can't it suit you?

9000
  • 39,899
  • 9
  • 66
  • 104
  • sorry but that's a bit vague... these list items are being dynamically created, they don't exist yet, i'm trying to get my head around this, can anyone help? – user482024 Jan 22 '11 at 17:09
  • these bars have certain characteristics, some assiciated data (e.g. IDs). you encode this data as a list of simple objects: `[{"bar_id": 10, "color": "brown"}, {"bar_id": 11, "color": "milky"}]` and store its string representation. when needed, you extract it and `eval()` or better use e.g. `jQuery.parseJSON()`, have your well-structured data back, create HTML representations. What am I missing? – 9000 Jan 22 '11 at 19:15
1

You can group multiple attributes together into objects, then store the objects in localStorage. By default, the localStorage key/value pairs stores the values as strings, however you can wrap this with something that converts between strings and objects - there are some examples on how to do this at Storing Objects in HTML5 localStorage

Community
  • 1
  • 1
dalelane
  • 2,746
  • 1
  • 24
  • 27