How can I add elements to a part of a json by using jquery

Question

I try to add elements in a particular way to the following JSON:

var data = [{"name":"google",
             "ip":"10.10.10.01",
             "markets":[{"name":"spain","county":"6002,6017,6018,6019,6020"},
                        {"name":"france","county":"6003,6005,6006,6007,6008,6025,6026,6027,6028,6029"},
                        {"name":"japan","county":"6004,6021,6022,6023,6024"},
                        {"name":"korea","county":"6000,6013,6014,6015,6016"},
                        {"name":"vietnam","county":"6001,6009,6010,6011,6012"}]},
            {"name":"amazon",
             "ip":"10.10.10.02",
             "markets":[{"name":"usa","county":"10000,10001,10002,10003,10004,10005"}]},
            {"name":"yahoo",
             "ip":"10.10.10.03",
             "markets":[{"name":"japan","county":"10000"}]}];

I want to add this element to the json:

newData = [{"name":"amazon",
            "ip":"10.10.10.02",
            "markets":[{"name":"mexico","county":"9000"}]}];

The result might be exactly this:

var data = [{"name":"google",
             "ip":"10.10.10.01",
             "markets":[{"name":"spain","county":"6002,6017,6018,6019,6020"},
                        {"name":"france","county":"6003,6005,6006,6007,6008,6025,6026,6027,6028,6029"},
                        {"name":"japan","county":"6004,6021,6022,6023,6024"},
                        {"name":"korea","county":"6000,6013,6014,6015,6016"},
                    {"name":"vietnam","county":"6001,6009,6010,6011,6012"}]},
            {"name":"amazon",
             "ip":"10.10.10.02",
             "markets":[{"name":"usa","county":"10000,10001,10002,10003,10004,10005"},
                        {"name":"mexico","county":"9000"}]},
            {"name":"yahoo",
             "ip":"10.10.10.03",
             "markets":[{"name":"japan","county":"10000"}]}];

I tried to use :

$.extend(data.markets, newData)

$.extend(true, data, newData); //this works only in the case every element is new.

but nothing works the way I pretend.

Could anyone give me a solution?

Thanks in advance.

FYI, what you posted is a JavaScript array containing objects, not JSON. `$.extend(data.markets, newData)` does not work because `data` is an array, and arrays don't have a `markets` property. `$.extend(true, data, newData)` doesn't work because again, `data` is an array, and you are trying to add the properties `name`, `ip` and `markets` to the array, which doesn't make sense. What you actually have to do is traverse `data` to find the object with a matching name and ip and merge their `markets` arrays. — Felix Kling, Jun 11 '14 at 08:05
Yeah, oddly JavaScript Object Notation does not refer to the notation used to denote JavaScript objects... — Jeff, Jun 11 '14 at 08:10

score 2 · Answer 1 · edited May 23 '17 at 12:27

2

You have an array of objects, where each object is like the following:

var item = {"name":"...",
            "ip":"...",
            "markets":[ /*some objects here*/];
}

So why not just creating your custom method to insert elements? It could search in the array if an item with the same name and ip exists, and then:

If it does exist: append the markets to the existing item markets attribute (maybe you need to check again if they already exist). UPDATE:The code that @jasonscript added in his answer will do the job: once you have found where to add the market, just add it to the array. Again, maybe you'll have to check if that market was already in the array. Using jQuery it will be: $.extend(true, data[i],newData)
If it doesn't exist: just add the item to the array: $.extend(true, data,newData)

edited May 23 '17 at 12:27

Community

1
1

answered Jun 11 '14 at 08:06

Pablo Lozano

10,122
2
38
59

Yes, the problem is that I don't know how to implementate the first case (append the markets to the existing item markets attribute). The second case is $.extend(true, data, newData), and it works perfectly – Dan Jun 11 '14 at 08:10
$.extend just merges two objects, so for the first case you can just write $.extend(true, data[i],newData), being `i` the index of the item that already exists – Pablo Lozano Jun 11 '14 at 08:28

score 2 · Accepted Answer · answered Jun 11 '14 at 08:08

You haven't created JSON, you've created a JavaScript literal object.

You could add this particular piece of newdata by

data[1].markets.push({"name":"mexico","county":"9000"})

Because you are dealing with javascript objects, you can write a function to check for the existence of data[n] and push data.

score 0 · Answer 3 · edited May 23 '17 at 12:20

Stealing a little code from another answer:

$.each(data, function(item){
    if(item.name == newData[0].name && item.ip == newData[0].ip) {
        item.markets.push.apply(item.markets, newData[0].markets);
    }
}

This assumes that you know that all the market items in the new object are different to the existing ones - otherwise you'd have to do a nested foreach or something. If you can change the notation of the objects a little you could think about using a dictionary-like object for Markets to make that a little cleaner.

In fact, changing data from an associative array would probably work for that too. Then you could easily check for existence with:

if(data[myNewDataName]){
    //add to markets
} else {
    data[myNewDataName] = myNewData;
}

How can I add elements to a part of a json by using jquery

3 Answers3