Siema,
Tworzę stronę, która ma statyczne divy z id i mam tzw modal, w którym mam formularz. W formularzu wybieram za pomocą select, do którego diva ma zostać dodany dynamicznie div z dwoma wartościami (nazwa i wartość + dane się zapisują do LocalStorage). Do tego miejsca wszystko jest ok, gdy odświeżę stronę funkcja, pobiera klucz z wartością i dodaje dynamicznie do diva. W jaki sposób zapisywać klucze, żeby np div1 miał tylko dodawane wybrane klucze. W obecnej chwili wszystkie klucze, które zostały zapisane w LS, są dodawane do pierwszego diva, a ja zapisałem np nową wartość do trzeciego diva itd.
Zamieszczam link o co mi mniej więcej chodzi http://jsfiddle.net/4am10d8s/
Dodałem nawias na końcu i działa, tzn. dodaje wartości do różnych divów w zależności od wyboru.
Owszem, to działało, tylko zgubiłem nawias. Teraz mi chodzi, że gdy odświeżę stronę to chce, żeby te wartości zostały w danych divach. Mam funkcje listAllItems(), która wczytuję klucze z localstorage i je wrzuca tylko jak ją przerobić, żeby w zależności, do którego diva została dodana wartość tam pozostała.
Możesz odwzorować interakcje użytkownika w LocalStorage w następujący sposób:
To wymagałoby małej przebudowy Twojego kodu:
function createEl() {
var doc = document.getElementById("formControl");
var keyForLocalStroage = doc.options[doc.selectedIndex].value;
var valuesForLocalStorage;
var localStorageItem = localStorage.getItem(keyForLocalStorage);
...
var valueForLocalStorage = {
propertyA: valuee,
propertyB: name
}
!localStorageItem ? valuesForLocalStorage = [] : valuesForLocalStorage = JSON.parse(localStorageItem);
valuesForLocalStorage.push(valueForLocalStorage);
localStorage.setItem(keyForLocalStroage, JSON.stringify(valuesForLocalStorage));
elementId.appendChild(createRow);
}
Następnie w "listAllItems()" możesz wyczytać wartości z LocalStorage korzystając z "JSON.parse":
for (i = 0; i < localStorage.length; i++) {
key = localStorage.key(i);
var localeStorageItem = JSON.parse(localStorage.getItem(key));
...
}
Przy edycji kodu natknąłem się na dwa problemy:
pierwszy: konsola pokazuje, że valuesForLocalStorage.push is not a function
drugi: po zapisaniu danych i ponownym wczytaniu pokazują się obiekty
Do problemu pierwszego: wrzuć kod do "jsfiddle". Wygląda jakby "valuesForLocalStorage" nie było zainicjalizowaną tablicą.
Do problemu drugiego: korzystasz przy wyczytaniu z "JSON.parse(localStorage.getItem(key))"?