CODEWITHSUNDEEP
javascriptjquerylocal-storage
TDG
TDG

Reputation: 1302

jQuery + localStorage - JSON value check true or false

We are storing a value in localstorage with Key name - cookiesettings. The value will be in JSON format like below.

{
   "enabled":true,
   "element1":{
      "enabled":true
   },
   "element2":{
      "enabled":true
   },
   "element3":{
      "enabled":false
   }
}

Not sure how to extract and check whether element3 is enabled true/false. If true, we need to show div. otherwise, hide div.

tried to use

localStorage.getItem('cookiesetting');
localStorage.getItem('cookiesetting.element3.enabled');

But getting undefined error. Tried to use:

JSON.parse(localStorage.getItem('cookiesetting'));

Still can't able to find a solution to check whether element3 - Enabled - True or False.

Upvotes: 2

Views: 271

Answers (2)

Girish Sasidharan
Girish Sasidharan

Reputation: 588

localStorage can't store objects, You need to store the JSON as a string, So convert your cookieObject to string before storing to the localStorage

localStorage.setItem('cookiesetting', JSON.stringify(cookieItem));

Get the string from localStorage and parse it and use like below

    let cookiesetting = JSON.parse(localStorage.getItem('cookiesetting'));
    if (!!cookiesetting) {
      console.log(cookiesetting.element3.enabled);
    }


let cookieItem = {
  "enabled": true,
  "element1": {
    "enabled": true
  },
  "element2": {
    "enabled": true
  },
  "element3": {
    "enabled": false
  }
};

localStorage.setItem('cookiesetting', JSON.stringify(cookieItem));
let cookiesetting = JSON.parse(localStorage.getItem('cookiesetting'));
if (!!cookiesetting) {
  console.log(cookiesetting.element3.enabled);
}

Upvotes: 0

Vivek Patel
Vivek Patel

Reputation: 1057

Check out this documentation which says Key and Value must be String.

https://developer.mozilla.org/en-US/docs/Web/API/Storage/setItem

So you have to store it a stringified version of the Object.

localStorage.setItem('cookiesetting', JSON.stringify({
  "enabled":true,
  "element1":{
    "enabled":true
  },
  "element2":{
    "enabled":true
  },
  "element3":{
    "enabled":false
  }
}))

You can get the Item by:

JSON.parse(localStorage.getItem('cookiesetting'))
JSON.parse(localStorage.getItem('cookiesetting')).element3.enabled

Let me know if you have any questions.

Upvotes: 3

Related Questions