How to link one array value to another array values?

Question

I have an array called category.

var category =  ["automobile","Fashion","Music Instruments"]

and I need to link this array with the below array according to product.

var products = ["LandRover","Guitar","vintage,"Drums","Maserati","Piano"]

What do you mean by "link"? Perhaps you can describe what you're actually trying to accomplish. — jfriend00
– jfriend00, Commented Nov 19, 2015 at 7:40
Kind of binary tree or hyperlink. Still unclear what you want. — hindmost
– hindmost, Commented Nov 19, 2015 at 7:50

Alberto Acuña · Accepted Answer · 2015-11-19 11:51:59Z

1

I think you are talking about some stuff like this?...

//variables predefined
var category = ["Automobile","Fashion","Music Instruments"]
var products = ["LandRover","Guitar","vintage","Drums","Maserati","Piano"]

//create a object categories where later we will add our products!
var categories = { };   

//add values(category & products)
categories[ category[0] ] = [ products[0] , products[4] ];              //Automobile
categories[ category[1] ] = [ products[2] ];               //Fashion
categories[ category[2] ] = [ products[1] , products[3] ,products[5]  ];     //Music Instrument

So now if you wanna display some value of 'automobile' for example, just:

//METHOD1
categories['automobile']
//METHOD2
categories[ category[0] ]     //category[0]->automobile

And what you get is the array with all the products of category,so you just have to choose wich one you want. Here you can see what you have got in console.

Function for show it in some HTML ( void html i hope)

function showObjectOnHTML( obj ){
   for (var key in categories) {   //check categories of thethe object
       if (categories.hasOwnProperty(key)) {

           var CATEGORIES = key;
           var SPAN = document.createElement('SPAN');
           SPAN.setAttribute('style','font-weight:bold; font-size: 20px; margin-left: 5px; display:block;');
           SPAN.appendChild( document.createTextNode( CATEGORIES ) );
           document.body.appendChild(SPAN);

           var PRODUCTS = categories[key];
           for( var i=0; i<PRODUCTS.length; i++){
               var SPAN = document.createElement('SPAN');
               SPAN.setAttribute('style','margin-left: 15px;font-size: 20px; display:block;');
               SPAN.appendChild( document.createTextNode( PRODUCTS[i] ) );
               document.body.appendChild(SPAN);
           }
       }
   }
}

For show it,just type,:

 showObjectOnHTML(categories);

edited Nov 19, 2015 at 11:51

answered Nov 19, 2015 at 10:10

Alberto Acuña

5453 gold badges10 silver badges30 bronze badges

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

14 Comments

maharshi oza Over a year ago

Yh. Thanks for understanding my problem. This code helps me.

maharshi oza Over a year ago

But I am not allowed to vote now as I am not the citizen of stackoverflow.. haha.. I am new in stackoverflow due to this currently I am not having right to vote

maharshi oza Over a year ago

I want to improve the display look. like:

maharshi oza Over a year ago

can you tell me how to do this?

Alberto Acuña Over a year ago

are you talking about the image? is using -> console.log(categories)

|

Murat Ozgul · Accepted Answer · 2015-11-19 07:51:27Z

0

I think what you need is an object (used like a "hashmap" in java):

//set examples
var category = {
    automobile: [],
    fashion: [],
    musicInstuments: ["Piano"]
};

category["automobile"] = category["automobile"].concat(["LandRover", "Maserati"]);
category.fashion.push("Vintage");


//get examples
for(var key in category){
    category[key].forEach(function(item){
        console.log(item);
    });
}

console.log(category.automobile[0]);

Using an object will also give you constant access time to the category you are looking for (instead of iterating over n items to find it)

answered Nov 19, 2015 at 7:51

Murat Ozgul

11.9k6 gold badges32 silver badges33 bronze badges

1 Comment

maharshi oza Over a year ago

I want to display according to category name

Arg0n · Accepted Answer · 2015-11-19 11:33:45Z

0

Maybe if you use objects instead of only lists?

var categories = [
    { 
       name: "Automobile",
       products: ["LandRover", "Maserati"]
    },
    { 
       name: "Fashion",
       products: ["Vintage"]
    },
    { 
       name: "Music Instruments",
       products: ["Guitar", "Drums", "Piano"]
    }
]

Also, like someone commented, what exactly do you want to accomplish?

EDIT

This JSFiddle shows one way to list products in each category using AngularJS.

edited Nov 19, 2015 at 11:33

answered Nov 19, 2015 at 7:54

Arg0n

8,4532 gold badges26 silver badges39 bronze badges

4 Comments

maharshi oza Over a year ago

I just want to display products according to respective category.

maharshi oza Over a year ago

In this scenario, I want to display it according to name.

maharshi oza Over a year ago

Can you tell me how to display it according to name

Arg0n Over a year ago

I have updated my answer with a JSFiddle for one way to display the data using AngularJS.

Collectives™ on Stack Overflow

How to link one array value to another array values?

3 Answers 3

14 Comments

1 Comment

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

14 Comments

1 Comment

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related