Adding Localstorage item for unique IDs-CodePudding

I want to know if its possible to use Javascript to set LocalStoarge for items to hide them.

The catch is they have unique IDs inside their ID attribute that gets generated so you have no idea what they might be but if you click the delete button it should set an item and hide it for that specific item with that specific ID:

<div  id="'.$contact_id.'">
 <button onclick="deleteChat(this)">X</button>
</div>

CodePudding user response：

LocalStorage is not hidden storage.

If you need a specific unique ID that doesn't require rules, Using a JavaScript library that creates a unique id can help. (like uuid or shortid)

CodePudding user response：

You can do it this way:

<div  id="'.$contact_id.'">
  <button onclick="deleteChat('.$contact_id.')">X</button>
</div>

window.onload = deleteChats();

function deleteChat(id){
  document.getElementById(id).style.display = "none"
  let items = JSON.parse(localStorage.getItem("deleted_items"));
  if(items){
    items.push(id);
  }
  else{
    items = [id];
  }
  localStorage.setItem("deleted_items",JSON.stringify(items));
}

function deleteChats(){
  const chats = JSON.parse(localStorage.getItem("deleted_items"));
  chats.map(chat => {
    document.getElementById(chat).display = "none";
  })
}