Get the value of localstorage

I have followed this example : Quick Tip: Persist Checkbox Checked State after Page Reload — SitePoint from @jhibbard This is working fine but now i struggle to work with the data saved in the localstorage.
I get the following ‘objet’ or ‘array’ {“checkbox1”:false,“checkbox2”:false,“checkbox3”:false,“checkbox4”:true,“checkbox5”:false,“checkbox6”:true,“checkbox7”:false,“checkbox8”:false,“checkbox9”:false}
And i would like to loop over it to get every key witch have the value true.
I have tryied this :

for(var i=0, len=localStorage.length; i<len; i++) {
    var key = localStorage.key(i);
	console.log("Clef",key);
    var value = localStorage[key];
    if(value==true)
    console.log(key + " => " + value);
}

But this is returning only the name Clef checkboxValues and the test if(value==true) is not working
If someone can help me to understand how i should proceed will be helpfull. Thanks

if (value == true) {
  console.log(key + " => " + value)
}

Note the missing curly brackets…

I think you’ll find the curly brackets are not needed if there is only one command to be executed if the condition is true.

1 Like

So you have an object not an array. You can iterate over it by using

for (const [key, value] of Object.entries(localStorage)) {
  console.log(`${key}: ${value}`);
}

Thanks, i have tried but it gives me same result. I want to extract all key having value=true and this just show me again in the consol the following :
TEST3 checkboxValues: {“checkbox1”:false,“checkbox2”:false,“checkbox3”:false,“checkbox4”:true,“checkbox5”:false,“checkbox6”:true,“checkbox7”:false,“checkbox8”:false,“checkbox9”:false}

:purple_heart: Javascript. Strange rules. Not consistent. And callbacks. :slight_smile:

1 Like

The value will be stored as a string so you will need to use:
if(value=='true')

The brackets are not needed in nearly all programming languages I know. This is nothing JavaScript special.

By the way, that’s why I love JavaScript. If you are a good experienced programmer you can write small and fast code with it because you do not need to take care of all these abstruse „we must make it safe so even the dumbest programmer will not make an error“ rules of other languages

1 Like

They’re not needed… until they’re needed. I like to still put curly braces around single-statement ifs, both because it looks right to me, and because it reminds me that the body of an if is a code block - even if it’s a one liner.

You cant do a lexical declaration (let, const) in a single-statement context (because it doesn’t really make any sense to do so), so:
if (true) let x = 3 will fail, because you wouldnt be declaring x in the global scope, you’d be declaring it at if-block scope, and since you’ve told Javascript you’re running a single command, it seems rather pointless to define a variable to do nothing with it.

1 Like

So filter what @Thallius gave you.
Object.entries(localStorage).filter(x => x[1] == "true")

(or use an if inside the loop. Either way works.)

Hum i don’t know but this is not working also.

This works:

for (const [key, value] of Object.entries(localStorage)) {
    if(value=='true') console.log(`${key}: ${value}`);
  }

Works for me:

Yes this is right as i was looking forward. But to reach this step i should be able to pass the first statement regarding the lenght of the object but as it’s considered as a string this cannot be done.
So far my understanading is to do this way, 1-I should buil a valid JSON object when i create the object
2-Parse the object before doing the test with something like this var getObj = JSON.parse(localStorage.getItem('checkboxValues'));
And i think will be ok :wink: Thanks

You seem to be making this far, far more complicated than necessary. It would help if you post the code you are now using.

Incidentally, with regard to Post #1, you should be using the Object.keys() method:

Ok sorry for that but i am not expert programer, i am just doing this for a personnal project.
I use this code :

var checkboxValues = JSON.parse(localStorage.getItem('checkboxValues')) || {};
var $checkboxes = $("#checkbox-container :checkbox");
$checkboxes.on("change", function(){
  $checkboxes.each(function(){
    checkboxValues[this.id] = this.checked;
  });
  localStorage.setItem("checkboxValues", JSON.stringify(checkboxValues));
});
$.each(checkboxValues, function(key, value) {
  $("#" + key).prop('checked',value);
});

Then is provide following result in the consol log :
{“checkbox1”:false,“checkbox2”:false,“checkbox3”:false,“checkbox4”:false,“checkbox5”:false,“checkbox6”:true,“checkbox7”:false,“checkbox8”:false,“checkbox9”:true}
And so i am blocked here because i don’t understand how to work with this object, i want to know how mutch checkbox are with the value true (in this example checkbox9) and use it later for an sql request.
Hope this is more clear :wink: Thanks

@lopesdaniel2001 when you post code, you need to use 3 backticks before and after, and on a line all of their own. I’ve changed it for you this time.

1 Like

Ok something wrong for me, can it be that my raw is not formated proprely ?
because i have this :
{“checkbox1”:false,“checkbox2”:false,“checkbox3”:false,“checkbox4”:false,“checkbox5”:false,“checkbox6”:true,“checkbox7”:false,“checkbox8”:false,“checkbox9”:true}
and with testing parse i get this :
{checkbox1: false, checkbox2: false, checkbox3: false, checkbox4: false, checkbox5: false, …}
and so i don’t have raw same as you…
But this exemple is good for me as i have acces to the code i will try to do it same as you. Thank you

FYI. Go and Rust requires curly brackets. My knowledge on other languages than Go and Javascript is limited. I think an interpreted language have more freedom maybe?

In the CodePen below I am saving to localStorage the initial values of the checkboxes when the web page is loaded. Clicking the button ‘read localStorage’ causes the checkboxes with value ‘true’ to be listed in the console log.