add values to multidemensional array

Question

I have this javascript code which generate a multi array with static values:

var items = [ ["red", "blue"], ["green", "yellow"] ];
console.log(items[1][1]); // green

but now I would like to fill the values dynamically. I tried this:

var items = [[]];
$.each($("input[name='checkboxColors1']:checked"), function(){            
   items[0].push($(this).val());
});

$.each($("input[name='checkboxColors2']:checked"), function(){            
    items[1].push($(this).val());
});

items[0].push... works, but items[1] not

TypeError: items[1] is undefined

Where is my fault?

if var items = [[]]; then items[1] is undefined. You can't push into undefined, you need to create the array first. — Mark
– Mark, Commented Jan 30, 2019 at 13:03
I have wrote you a full working code down below, as an answer, let me know if it works for you — Eyal c
– Eyal c, Commented Jan 31, 2019 at 19:00

MarcoS · Accepted Answer · 2019-01-30 13:07:48Z

2

Javascript is asynchronous... You can't expect two functions to be executed sequentially... :-)

This way can work... But you must initialize your initial array this way:

var items = [ [], [] ];

Since with

var items = [[]];

You only define one internal array inside the external array (items[0]), but you want two (items[0], items[1]).

edited Jan 30, 2019 at 13:07

answered Jan 30, 2019 at 13:03

MarcoS

17.8k27 gold badges101 silver badges189 bronze badges

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

6 Comments

Mark Over a year ago

Which part of this is asynchronous? It's just looping over the inputs synchronously. And javascript isn't by nature asynchronous. Two functions called in order will execute in order.

Suxino Over a year ago

The fact that JS is asynchronous has nothing to do with this issue.

MarcoS Over a year ago

@Suxino: you are right, but with the first version of the question it had... :-)

MarcoS Over a year ago

All javascript is asyncronous... the two anonymous functions you define will be executed in undefined order... But, as @Suxino noted, if you populate two difefrent variables (items[0] and items[1]), as you currently do, you can forget about asynchronicity... If, as in the first revision of your question, you populate one single array, you can find an undefined element...

Mark Over a year ago

Functions will be executed in the order they are called. If the function is passed as a callback to an async operation then it will be called in the future. It is totally false to say all javascript is asynchronous.

|

Suxino · Accepted Answer · 2019-01-30 13:06:37Z

2

var items = [[]]; You issue is here.

items[0] is an array. but items[1] is undefined. In order to work you need to define items as [[],[]]

Or to make it more dynamic you could do check before that $.each if the items[1] exists and if not create it

answered Jan 30, 2019 at 13:06

Suxino

1695 bronze badges

Comments

Yanick Frehner · Accepted Answer · 2019-01-30 13:09:34Z

1

You cannot push into an undefined array, you first need to create the array.

You're code has to look like this:

var items = [[], []];
$.each($("input[name='checkboxColors1']:checked"), function(){            
   items[0].push($(this).val());
});

$.each($("input[name='checkboxColors2']:checked"), function(){            
    items[1].push($(this).val());
});

Then it should work properly.

answered Jan 30, 2019 at 13:09

Yanick Frehner

214 bronze badges

Comments

Leandro Castro · Accepted Answer · 2019-01-30 13:12:57Z

0

I think you are confused about "push" function. This function insert a new element on the last position of array.

For example

var items = ["grape"];
items.push("apple"); 
console.log(items); //["grape", "apple"].

answered Jan 30, 2019 at 13:12

Leandro Castro

2512 silver badges15 bronze badges

Comments

SINGH · Accepted Answer · 2019-01-30 13:31:13Z

0

The best way to do it by creating a Array object and assign values dynamically. In this way you can also define string key as well.Please see below

var items = new Array();

    items[0] = 1;
    items[1] = 2;
    console.log(items);

//Uncomment above block to test.
var items = new Array();
var items0 = [];
var items1 = [];
$.each($("input[name='checkboxColors1']:checked"), function(){            
   items0 = $(this).val();
});

$.each($("input[name='checkboxColors2']:checked"), function(){            
    items1 = $(this).val();
});
items[0] = items0;
items[1] = items1;

edited Jan 30, 2019 at 13:31

answered Jan 30, 2019 at 13:18

SINGH

3971 gold badge4 silver badges17 bronze badges

3 Comments

SINGH Over a year ago

@Mark Meyer just edited my answer now i have shared code snippet of sample code.

SINGH Over a year ago

@MarkMeyer have you checked?

Mark Over a year ago

This is no longer throws an error, but it doesn't do what the OP wants. They want items[0] and items[1] to be arrays, hence the title multidemensional array

Eyal c · Accepted Answer · 2019-01-30 13:59:45Z

Be careful when you combine static multi-dimension array, with dynamically adding elements with push.

Try the following code, that is dynamic for the two dimensions.

var checkBoxGroupNames = ['checkboxColors1', 'checkboxColors2'];
var items = [];

var checkedChkBoxes = [];

for (var i = 0; i < checkBoxGroupNames.length; i++) {
    checkedChkBoxes = [];

    $.each($("input[name=" + checkBoxGroupNames[i] + "]:checked"), function(){
        checkedChkBoxes.push($(this).val());
    });

    items.push(checkedChkBoxes);
}

console.log(items); // items now holds the two dimension array

For a cleaner code, you may put the logic that find checked checkboxes per group - in a function.

var checkBoxGroupNames = ['checkboxColors1', 'checkboxColors2'];
var items = [];

$.each(checkBoxGroupNames, function(){
  items.push(GetCheckedChkBoxes(this));
});

console.log(items); // items now holds the two dimension array

function GetCheckedChkBoxes(chkBoxGroupName) {
  checkedChkBoxes = [];

  $.each($("input[name=" + chkBoxGroupName + "]:checked"), function(){
    checkedChkBoxes.push($(this).val());
  });

  return checkedChkBoxes;
}

Collectives™ on Stack Overflow

add values to multidemensional array

6 Answers 6

6 Comments

Comments

Comments

Comments

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

6 Comments

Comments

Comments

Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related