JavaScript: How to Get the Values from a Multi-Dimensional Array?

Question

I'm trying to get the values from a multi-dimensional array. This is what I have so far.
I need the value of 99 and the image when I select the first option in the array, e.g. "Billy Joel".

var concertArray = [
    ["Billy Joel", "99", "equal.png"],
    ["Bryan Adams", "89", "higher.png"],
    ["Brian Adams", "25", "lower.png"]
];

function populate(){
    for(i = 0; i < concertArray.length; i++){
        var select = document.getElementById("test");
        select.options[select.options.length] = new Option(concertArray[i][0], concertArray[i][1]);
    }
}

JJJ · Accepted Answer · 2017-03-30 07:20:25Z

17

You can try to transform the multi-dimensional array to an array of objects like this:

var concertArray = [
    {name: "Billy Joel", value: 99, image: "equal.png"},
    {name: "Bryan Adams", value: 89, image: "higher.png"},
    {name: "Brian Adams", value: 25, image: "lower.png"}
];

Then you can access the items in the array like regular objects:

var concertName = concertArray[0].name;
var concertPrice = parseFloat(concertArray[0].value);
var concertImage = concertArray[0].image;

edited Mar 30, 2017 at 7:20

JJJ

33.2k20 gold badges95 silver badges103 bronze badges

answered May 4, 2012 at 21:50

user1341217

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

1 Comment

aspiring Over a year ago

How to iterate this kind of an array?

azro · Accepted Answer · 2021-04-25 11:09:37Z

6

let concertArray = [
    ["Billy Joel", "99", "equal.png"],
    ["Bryan Adams", "89", "higher.png"],
    ["Brian Adams", "25", "lower.png"]
];

let i = 0;

console.log(concertArray[i][1]) // 99
console.log(concertArray[i][2]) // equal.png

edited Apr 25, 2021 at 11:09

azro

54.2k9 gold badges38 silver badges75 bronze badges

answered Apr 22, 2012 at 19:33

mgraph

15.3k4 gold badges43 silver badges76 bronze badges

1 Comment

kentrenholm Over a year ago

Thanks so much.... Now, what would I have to do to complete the concertImage in this structure: concertName = concertList.options[concertIndex].text; concertPrice = parseFloat(concertList.options[concertIndex].value); concertImage = ???

David Hellsing · Accepted Answer · 2012-04-22 19:36:08Z

0

AFAIK, the Option constructor only takes two arguments, the text and the value. If you want to pass more data, I suggest you use the HTML5 data API:

var opt = new Option(concertArray[i][0], concertArray[i][1]);
opt.setAttribute('data-image', concertArray[i][2]);
select.options[select.options.length] = opt;

Then you can grab it using getAttribute('data-image')

answered Apr 22, 2012 at 19:36

David Hellsing

109k44 gold badges181 silver badges214 bronze badges

Comments

JJJ · Accepted Answer · 2017-03-30 07:21:29Z

0

You can access values by using 2 for loops as below.

var concertArray = [
    ["Billy Joel", "99", "equal.png"],
    ["Bryan Adams", "89", "higher.png"],
    ["Brian Adams", "25", "lower.png"]
    ];

function populate(){
    for(i=0;i<arr.length;i++)
    {
        for(j=0;j<arr[i].length;j++)
        {
             console.log(arr[i][j]);
        }
    }
}

edited Mar 30, 2017 at 7:21

JJJ

33.2k20 gold badges95 silver badges103 bronze badges

answered Mar 30, 2017 at 7:00

Rupal

1,1096 silver badges17 bronze badges

1 Comment

Kir Mazur Over a year ago

This answer is awfully bad for large arrays.

Collectives™ on Stack Overflow

JavaScript: How to Get the Values from a Multi-Dimensional Array?

4 Answers 4

1 Comment

1 Comment

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

1 Comment

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related