• Home
  • Jobs
  • Courses
  • Questions
  • Teachers
  • For business
  • ES/EN

0

25
Views
Adding Localstorage item for unique IDs

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:

List of Messages

<div class="'.$contact_id.'-chat" id="'.$contact_id.'">
 <button onclick="deleteChat(this)">X</button>
</div>
about 1 month ago ·

Juan Pablo Isaza

2 answers
Answer question

0

You can do it this way:

<div class="1-chat" 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";
  })
}
about 1 month ago · Juan Pablo Isaza Report

0

Js Fiddle Link check this out

hide all ids from localstorage

window.onload = function() {
 allStorage().map(id => {
      $("#"+id).hide();
  })
}

Get get all ids in localstorage

 function allStorage() {
    var values = [],
        keys = Object.keys(localStorage),
        i = keys.length;
    while ( i-- ) {
        values.push( localStorage.getItem(keys[i]) );
    }
    return values;
}

Get id from class, hide the div and set an item in localstorage

$('.del').on('click', function(event) {
       $("#"+this.id).hide();
       window.localStorage.setItem("id"+this.id, this.id)
})
about 1 month ago · Juan Pablo Isaza Report
Answer question
Find remote jobs
Loading

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post job Plans Our process Sales
Legal
Terms and conditions Privacy policy
© 2022 PeakU Inc. All Rights Reserved.