Deleting all elements in json array in jquery and javascript

Question

I was working on a method that can erase all of the array content in "Bottin". The data is stored on the LocalStorage of the computer in a key called "Data".

Here's my sample of Json :

{
 "descriptions": [
 {
 "Fabricant": "Test",
 "Produit": "Test",
 "Prix": "11.11",
 "Details": " asdfasd",
 "Categorie": "Categorie_Baseball",
 "Images": "Hockey_Article_01.jpg"
 },{
 "Fabricant": "Test",
 "Produit": "Test",
 "Prix": "11.11",
 "Details": " asdfasd",
 "Categorie": "Categorie_Baseball",
 "Images": "Hockey_Article_01.jpg"
 },{
 "Fabricant": "Test",
 "Produit": "Test",
 "Prix": "11.11",
 "Details": " asdfasd",
 "Categorie": "Categorie_Baseball",
 "Images": "Hockey_Article_01.jpg"
 }
 ],
 "Bottin": [
 {
 "Nom": "Andy",
 "Prenom": "Matador",
 "Fonction": "dtesasd",
 "Courriel": "[email protected]",
 "Telephone": "515-555-5555"
 }, {
 "Nom": "Andy",
 "Prenom": "Matador",
 "Fonction": "dtesasd",
 "Courriel": "[email protected]",
 "Telephone": "515-555-5555"
 },{
 "Nom": "Andy",
 "Prenom": "Matador",
 "Fonction": "dtesasd",
 "Courriel": "[email protected]",
 "Telephone": "515-555-5555"
 }
 ],
 "users": {
 "admin": "Inf2005"
 }
}

Here's my partial solution :

function delAllBottin() {
 bd = localStorage.getItem('data'); 
 var descJsonObjects = bd.Bottin;
 bd.Bottin.splice(0, descJsonObjects.length); 
}

Doesn't seem to work for now, i don't know what i'm missing here ...

• Neeraj Verma: I think after delete, you should save the updated data again in localStorage.
• Tᴀʀᴇǫ Mᴀʜᴍᴏᴏᴅ: What do you mean by doesn't work? It shows error or just not removing the items?
• Cyberflow: @NeerajVerma : Good point ! Let me test this tomorrow morning. Will keep you posted. Guess i was too much tired.
• Cyberflow: @TareqMahmood : No error, its just not removing nothing.
• Chintan Soni: Have you tried my answer ?

Answer 1

First of all, store json object in string format like:

var data = {
 "descriptions": [
 {
 "Fabricant": "Test",
 "Produit": "Test",
 "Prix": "11.11",
 "Details": " asdfasd",
 "Categorie": "Categorie_Baseball",
 "Images": "Hockey_Article_01.jpg"
 },{
 "Fabricant": "Test",
 "Produit": "Test",
 "Prix": "11.11",
 "Details": " asdfasd",
 "Categorie": "Categorie_Baseball",
 "Images": "Hockey_Article_01.jpg"
 },{
 "Fabricant": "Test",
 "Produit": "Test",
 "Prix": "11.11",
 "Details": " asdfasd",
 "Categorie": "Categorie_Baseball",
 "Images": "Hockey_Article_01.jpg"
 }
 ],
 "Bottin": [
 {
 "Nom": "Andy",
 "Prenom": "Matador",
 "Fonction": "dtesasd",
 "Courriel": "[email protected]",
 "Telephone": "515-555-5555"
 }, {
 "Nom": "Andy",
 "Prenom": "Matador",
 "Fonction": "dtesasd",
 "Courriel": "[email protected]",
 "Telephone": "515-555-5555"
 },{
 "Nom": "Andy",
 "Prenom": "Matador",
 "Fonction": "dtesasd",
 "Courriel": "[email protected]",
 "Telephone": "515-555-5555"
 }
 ],
 "users": {
 "admin": "Inf2005"
 }
}
localStorage.setItem("data", JSON.stringify(data));

Now, to clear Bottin array from it:

var data = JSON.parse(localStorage.getItem("data"));
data.Bottin = []; // array cleared

Now, save it again:

localStorage.setItem("data", JSON.stringify(data));

• Cyberflow: Simple solution ! Gona save some CPU usage without using the for() ! Thank you

Answer 2

You cannot get / set an object as value for localStorage / sessionStorage. You need to make it a JSON string before setting and parse the JSON after getting from storage.

When setting

var data = {.....}; //Build your data object
localStorage.setItem('data', JSON.stringify(data));

When getting (and editing)

var jsonData = localStorage.getItem('data');
var data = JSON.parse(jsonData);
//If you want to do any modification, do it now
//then set it back to the storage
localStorage.setItem('data', JSON.stringify(data));

Answer 3

1 Parse the string in localStorage to JSON

2 Remove the item you don't want (with slice() )

3 Make the JSON to string

4 Re-set it in the localStorage

var items = JSON.parse(localStorage.getItem("data")); // updated
 for (var i =0; i< items.length; i++) {
 var items = JSON.parse(items[i]);
 items.splice(i, 1);
 }
 item = JSON.stringify(items);
 localStorage.setItem("data", items);

• Identity1: I don't think this is OP's issue. Its probably something to do with persistence of his object in local storage