Rectangle 27 0

javascript LocalStorage storing multiple div hides?


// restore
 var divstate = JSON.parse( localStorage.getItem( 'divstate' );
// your array
 var divstate = [ ... ];

 // store it
 localStorage.setItem( 'divstate', JSON.stringify( divstate ) );
function ShowHide(id) {
  var el = document.getElementById(id);

  if ( divstate[id] === true ) {
    divstate[id] = false;
    el.style.display = 'none';
  } else {
    divstate[id] = true;
    el.style.display = '';
  }

  localStorage.setItem( 'divstate', JSON.stringify( divstate ) );
}
var divstate = {
  'divid1': true,
  'divid2': false,
  ...
};

For the above code I would suggest loading the state variable once at page load using the above statement.

If you want to retrieve the array again, use JSON.parse():

Like you said, you already have an array storing all your state. You can serialize this using JSON.stringify() and put the result into localStorage.

Note, that I would not recommend this, if the number of divs is too high, but for smaller amounts this should be sufficient.

See my edit to my question to see a rough draft of the code I am using to hide my divs. How can I implement local storage into that along with your code?

Thanks :D I will try it out as soon as Im around my code again. I would upvote but I dont have the reputation :(

That way the divstate is updated and stored with each function call.

Then transform the function like this:

This can easily be used with the above pattern.

To store the actual ids of all divs, you probably will use something like this

Note
Rectangle 27 0

javascript LocalStorage storing multiple div hides?


// restore
 var divstate = JSON.parse( localStorage.getItem( 'divstate' );
// your array
 var divstate = [ ... ];

 // store it
 localStorage.setItem( 'divstate', JSON.stringify( divstate ) );
function ShowHide(id) {
  var el = document.getElementById(id);

  if ( divstate[id] === true ) {
    divstate[id] = false;
    el.style.display = 'none';
  } else {
    divstate[id] = true;
    el.style.display = '';
  }

  localStorage.setItem( 'divstate', JSON.stringify( divstate ) );
}
var divstate = {
  'divid1': true,
  'divid2': false,
  ...
};

For the above code I would suggest loading the state variable once at page load using the above statement.

If you want to retrieve the array again, use JSON.parse():

Like you said, you already have an array storing all your state. You can serialize this using JSON.stringify() and put the result into localStorage.

Note, that I would not recommend this, if the number of divs is too high, but for smaller amounts this should be sufficient.

See my edit to my question to see a rough draft of the code I am using to hide my divs. How can I implement local storage into that along with your code?

Thanks :D I will try it out as soon as Im around my code again. I would upvote but I dont have the reputation :(

That way the divstate is updated and stored with each function call.

Then transform the function like this:

This can easily be used with the above pattern.

To store the actual ids of all divs, you probably will use something like this

Note