Loop through items in JQuery and output JSON object

Question

I'm trying to create a simple JSON object from a list of elements and output it in a specific format (to be sent to a server).

I'm unsure exactly how to properly execute this to get the output I need. So far I've looped through the items and got the relevant data:

    function getCartItems() {
        cart_data = [];
        $('.cart-item').each(function(){
            var sku = $(this).data('sku'),
                qty = $(this).find('input.cart-item-qty').val();
            item = {};
            item[sku] = qty;
            cart_data.push(item);
        });
        return cart_data;
    }

This gives me an array of items as expected:

[
    {"sku1":"1"},
    {"sku2":"1"}
]

But what I'M TRYING TO GET is the following format:

{
    "sku1":1,
    "sku2":1
}

This output is then being used in a function like this:

function getData() {
    var cart_items = getCartItems();
    return JSON.stringify({"items":cart_items,"ref":"123"});
}

Where the final output will be:

{
    "items": {
        "sku1": 1,
        "sku2": 1
    },
    "ref": "123"
}

The question shows absolutely no effort in solving the problem. I don't think "pls solve for me" kind of questions are acceptable at SO. — lucifer63
– lucifer63, Commented Jun 10, 2019 at 8:52

Rory McCrossan · Accepted Answer · 2019-06-10 08:49:03Z

1

You're creating an array when your target output is an object. Instead of pushing the new object to an array you can instead define a parent object and set the key/value pairs within it, like this:

function getCartItems() {
  var cart_data = {};
  $('.cart-item').each(function() {
    cart_data[$(this).data('sku')] = $(this).find('input.cart-item-qty').val();
  });
  return cart_data;
}

answered Jun 10, 2019 at 8:49

Rory McCrossan

338k41 gold badges321 silver badges353 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

steven7mwesigwa · Accepted Answer · 2019-06-10 09:10:37Z

0

Try this:

1. Simply Create an empty object i.e

let result = {};

2. Then write:

 cart_data.forEach(i => Object.assign(result ,i))

3. Finally return the result

return result;

Full code

    function getCartItems() {
        cart_data = [];
        let result = {};
        $('.cart-item').each(function(){
            var sku = $(this).data('sku'),
                qty = $(this).find('input.cart-item-qty').val();
            item = {};
            item[sku] = qty;
            cart_data.push(item);
        });

        cart_data.forEach(i => Object.assign(result ,i))
        return result ;
    }

Good Luck :)

answered Jun 10, 2019 at 9:10

steven7mwesigwa

6,8783 gold badges27 silver badges40 bronze badges

Collectives™ on Stack Overflow

Loop through items in JQuery and output JSON object

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related