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 ...

I think after delete, you should save the updated data again in localStorage. — Neeraj Verma
– Neeraj Verma, Commented Dec 17, 2015 at 5:16
What do you mean by doesn't work? It shows error or just not removing the items? — Tᴀʀᴇǫ Mᴀʜᴍᴏᴏᴅ
– Tᴀʀᴇǫ Mᴀʜᴍᴏᴏᴅ, Commented Dec 17, 2015 at 5:17
@NeerajVerma : Good point ! Let me test this tomorrow morning. Will keep you posted. Guess i was too much tired. — Cyberflow
– Cyberflow, Commented Dec 17, 2015 at 5:25

Chintan Soni · Accepted Answer · 2015-12-17 05:40:29Z

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));

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

Tᴀʀᴇǫ Mᴀʜᴍᴏᴏᴅ · Accepted Answer · 2015-12-17 05:28:34Z

1

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));

answered Dec 17, 2015 at 5:28

Tᴀʀᴇǫ Mᴀʜᴍᴏᴏᴅ

4,2261 gold badge27 silver badges55 bronze badges

Comments

Shailesh Katarmal · Accepted Answer · 2015-12-17 05:34:02Z

1

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);

edited Dec 17, 2015 at 5:34

answered Dec 17, 2015 at 5:20

Shailesh Katarmal

2,7931 gold badge15 silver badges16 bronze badges

1 Comment

Identity1 Over a year ago

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

Collectives™ on Stack Overflow

Deleting all elements in json array in jquery and javascript

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related