Get value of key from object using variable and object

Question

I'm trying to get a value from my object using variable and another object. The first variable worked very well, but is get stuck at the second one and tried a lot of things without success.

console.log(data.data.mengsels_data['mengsels_label_'+counter_i]);
console.log(data.data.mengsels_data['mengsels_label_'+counter_i[sessionStorage.language]]);
console.log(sessionStorage.language);

The first line returns;

Object {nl: "April", en: "April", de: ""}

Second line returns;

undefined

Third line returns

nl

I need to get 'April'

Added later

In the example below data is retrieved with ajax call, from original it's json but ajax transfer it inside a object.

Only in this example i placed 'var data' manually with the full ajax response, in my example it's not transferred into object.

My goal is to loop trough each image and take the image and the label in the right language what is part of the image.

var data = {
  "code": "0",
  "success": [],
  "error": [],
  "data": {
    "0": "1",
    "mengsels_id": "1",
    "1": "Data Removed",
    "mengsels_name": "Data Removed",
    "2": "-",
    "mengsels_description": "-",
    "3": "\/media\/mengsels\/data-removed\/data-removed-1.jpg",
    "mengsels_cover": "\/media\/mengsels\/data-removed\/data-removed-1.jpg",
    "4": "",
    "mengsels_folder": "",
    "5": "",
    "mengsels_video": "",
    "6": "1",
    "mengsels_visible": "1",
    "7": "{\"mengsels_name\":\"Data Removed\",\"mengsels_description\":\"-\",\"mengsels_cover\":\"\\\/media\\\/mengsels\\\/data-removed\\\/data-removed-1.jpg\",\"mengsels_img_1\":\"\\\/media\\\/mengsels\\\/data-removed\\\/data-removed-1.jpg\",\"mengsels_img_2\":\"\\\/media\\\/mengsels\\\/data-removed\\\/data-removed-2.jpg\",\"mengsels_img_3\":\"\\\/media\\\/mengsels\\\/data-removed\\\/data-removed-3.jpg\",\"mengsels_img_4\":\"\\\/media\\\/mengsels\\\/data-removed\\\/data-removed-4.jpg\",\"mengsels_img_5\":\"\\\/media\\\/mengsels\\\/data-removed\\\/data-removed-5.jpg\",\"mengsels_img_6\":\"\\\/media\\\/mengsels\\\/data-removed\\\/data-removed-6.jpg\",\"mengsels_img_7\":\"\",\"mengsels_img_8\":\"\",\"mengsels_img_9\":\"\",\"mengsels_img_10\":\"\",\"mengsels_label_1\":{\"nl\":\"Januari\",\"en\":\"Januari\",\"de\":\"\"},\"mengsels_label_2\":{\"nl\":\"Februari\",\"en\":\"Februari\",\"de\":\"\"},\"mengsels_label_3\":{\"nl\":\"Maart\",\"en\":\"March\",\"de\":\"\"},\"mengsels_label_4\":{\"nl\":\"April\",\"en\":\"April\",\"de\":\"\"},\"mengsels_label_5\":{\"nl\":\"Mei\",\"en\":\"May\",\"de\":\"\"},\"mengsels_label_6\":{\"nl\":\"Juni\",\"en\":\"June\",\"de\":\"\"},\"mengsels_label_7\":{\"nl\":\"\",\"en\":\"\",\"de\":\"\"},\"mengsels_label_8\":{\"nl\":\"\",\"en\":\"\",\"de\":\"\"},\"mengsels_label_9\":{\"nl\":\"\",\"en\":\"\",\"de\":\"\"},\"mengsels_label_10\":{\"nl\":\"\",\"en\":\"\",\"de\":\"\"}}",
    "mengsels_data": {
      "mengsels_name": "Data Removed",
      "mengsels_description": "-",
      "mengsels_cover": "\/media\/mengsels\/data-removed\/data-removed-1.jpg",
      "mengsels_img_1": "\/media\/mengsels\/data-removed\/data-removed-1.jpg",
      "mengsels_img_2": "\/media\/mengsels\/data-removed\/data-removed-2.jpg",
      "mengsels_img_3": "\/media\/mengsels\/data-removed\/data-removed-3.jpg",
      "mengsels_img_4": "\/media\/mengsels\/data-removed\/data-removed-4.jpg",
      "mengsels_img_5": "\/media\/mengsels\/data-removed\/data-removed-5.jpg",
      "mengsels_img_6": "\/media\/mengsels\/data-removed\/data-removed-6.jpg",
      "mengsels_img_7": "",
      "mengsels_img_8": "",
      "mengsels_img_9": "",
      "mengsels_img_10": "",
      "mengsels_label_1": {
        "nl": "Januari",
        "en": "Januari",
        "de": ""
      },
      "mengsels_label_2": {
        "nl": "Februari",
        "en": "Februari",
        "de": ""
      },
      "mengsels_label_3": {
        "nl": "Maart",
        "en": "March",
        "de": ""
      },
      "mengsels_label_4": {
        "nl": "April",
        "en": "April",
        "de": ""
      },
      "mengsels_label_5": {
        "nl": "Mei",
        "en": "May",
        "de": ""
      },
      "mengsels_label_6": {
        "nl": "Juni",
        "en": "June",
        "de": ""
      },
      "mengsels_label_7": {
        "nl": "",
        "en": "",
        "de": ""
      },
      "mengsels_label_8": {
        "nl": "",
        "en": "",
        "de": ""
      },
      "mengsels_label_9": {
        "nl": "",
        "en": "",
        "de": ""
      },
      "mengsels_label_10": {
        "nl": "",
        "en": "",
        "de": ""
      }
    }
  }
};
$.ajax({
  type: 'GET',
  url: "https://xxx.xxx.xx/xxx/x.x/mengsels/?action=view",
  data: {
    mengsels_id: mengsels_id
  },
  dataType: 'json',
  success: function(data) {
    $('#stage').html("");
    var counter_i = 0;
    for (var match in data.data.mengsels_data) {
      var reg = /(mengsels_img_[0-9]{1,})/g;
      if (reg.exec(match)) {
        if (data.data.mengsels_data[match]) {
          $('#stage').append('<div class="slideshow-div slideshow-2" data-counter="' + counter_i + '"> \
                                  <div class="slideshow-image" style="background-image: url(\'https://xxx.xxx.xx' + data.data.mengsels_data[match] + '\');" class="slideshow-image"> \
                                  </div><span></span> \
                                </div>');
          console.log(data.data.mengsels_data['mengsels_label_' + counter_i]);
          console.log(data.data.mengsels_data['mengsels_label_' + counter_i][sessionStorage.language]);
          console.log(counter_i);
          console.log(sessionStorage.language);
          console.log(data.data.mengsels_data['mengsels_label_' + counter_i]['nl']);
          console.log(data.data.mengsels_data['mengsels_label_' + counter_i].nl);
          counter_i++;
        }
      }
    }
  }
});

I think you mistyped something. Can you try console.log(data.data.mengsels_data['mengsels_label_'+counter_i][sessionStorage.language]); ? — Pedro Simão
– Pedro Simão, Commented Sep 5, 2018 at 23:10

Mark · Accepted Answer · 2018-09-05 23:59:27Z

2

nl is a property of data.data.mengsels_data['mengsels_label_'+counter_i] and sessionStorage.language === nl. So you should be able to use:

data.data.mengsels_data['mengsels_label_'+counter_i][sessionStorage.language]

Edit based on new code:

The code you have is starting the counter at 0 but the data starts at mengsels_label_1, which means on the first iteration you are looking for mengsels_label_0, which doesn't exist. Try starting at 1:

var data = {"code": "0","success": [],"error": [],"data": {"0": "1","mengsels_id": "1","1": "Data Removed","mengsels_name": "Data Removed","2": "-","mengsels_description": "-","3": "\/media\/mengsels\/data-removed\/data-removed-1.jpg","mengsels_cover": "\/media\/mengsels\/data-removed\/data-removed-1.jpg","4": "","mengsels_folder": "","5": "","mengsels_video": "","6": "1","mengsels_visible": "1","7": "{\"mengsels_name\":\"Data Removed\",\"mengsels_description\":\"-\",\"mengsels_cover\":\"\\\/media\\\/mengsels\\\/data-removed\\\/data-removed-1.jpg\",\"mengsels_img_1\":\"\\\/media\\\/mengsels\\\/data-removed\\\/data-removed-1.jpg\",\"mengsels_img_2\":\"\\\/media\\\/mengsels\\\/data-removed\\\/data-removed-2.jpg\",\"mengsels_img_3\":\"\\\/media\\\/mengsels\\\/data-removed\\\/data-removed-3.jpg\",\"mengsels_img_4\":\"\\\/media\\\/mengsels\\\/data-removed\\\/data-removed-4.jpg\",\"mengsels_img_5\":\"\\\/media\\\/mengsels\\\/data-removed\\\/data-removed-5.jpg\",\"mengsels_img_6\":\"\\\/media\\\/mengsels\\\/data-removed\\\/data-removed-6.jpg\",\"mengsels_img_7\":\"\",\"mengsels_img_8\":\"\",\"mengsels_img_9\":\"\",\"mengsels_img_10\":\"\",\"mengsels_label_1\":{\"nl\":\"Januari\",\"en\":\"Januari\",\"de\":\"\"},\"mengsels_label_2\":{\"nl\":\"Februari\",\"en\":\"Februari\",\"de\":\"\"},\"mengsels_label_3\":{\"nl\":\"Maart\",\"en\":\"March\",\"de\":\"\"},\"mengsels_label_4\":{\"nl\":\"April\",\"en\":\"April\",\"de\":\"\"},\"mengsels_label_5\":{\"nl\":\"Mei\",\"en\":\"May\",\"de\":\"\"},\"mengsels_label_6\":{\"nl\":\"Juni\",\"en\":\"June\",\"de\":\"\"},\"mengsels_label_7\":{\"nl\":\"\",\"en\":\"\",\"de\":\"\"},\"mengsels_label_8\":{\"nl\":\"\",\"en\":\"\",\"de\":\"\"},\"mengsels_label_9\":{\"nl\":\"\",\"en\":\"\",\"de\":\"\"},\"mengsels_label_10\":{\"nl\":\"\",\"en\":\"\",\"de\":\"\"}}","mengsels_data": {"mengsels_name": "Data Removed","mengsels_description": "-","mengsels_cover": "\/media\/mengsels\/data-removed\/data-removed-1.jpg","mengsels_img_1": "\/media\/mengsels\/data-removed\/data-removed-1.jpg","mengsels_img_2": "\/media\/mengsels\/data-removed\/data-removed-2.jpg","mengsels_img_3": "\/media\/mengsels\/data-removed\/data-removed-3.jpg","mengsels_img_4": "\/media\/mengsels\/data-removed\/data-removed-4.jpg","mengsels_img_5": "\/media\/mengsels\/data-removed\/data-removed-5.jpg","mengsels_img_6": "\/media\/mengsels\/data-removed\/data-removed-6.jpg","mengsels_img_7": "","mengsels_img_8": "","mengsels_img_9": "","mengsels_img_10": "","mengsels_label_1": {"nl": "Januari","en": "Januari","de": ""},"mengsels_label_2": {"nl": "Februari","en": "Februari","de": ""},"mengsels_label_3": {"nl": "Maart","en": "March","de": ""},"mengsels_label_4": {"nl": "April","en": "April","de": ""},"mengsels_label_5": {"nl": "Mei","en": "May","de": ""},"mengsels_label_6": {"nl": "Juni","en": "June","de": ""},"mengsels_label_7": {"nl": "","en": "","de": ""},"mengsels_label_8": {"nl": "","en": "","de": ""},"mengsels_label_9": {"nl": "","en": "","de": ""},"mengsels_label_10": {"nl": "","en": "","de": ""}}}};

function test(data) {
    const sessionStorage = {language: "nl"}
    var counter_i = 1; // <-- start at 1
    for (var match in data.data.mengsels_data) {
        var reg = /(mengsels_img_[0-9]{1,})/g;
        if (reg.exec(match)) {
          if (data.data.mengsels_data[match]) {      
            console.log(data.data.mengsels_data['mengsels_label_' + counter_i][sessionStorage.language]);
            counter_i++;
          }
        }
      }
    }
test(data)

edited Sep 5, 2018 at 23:59

answered Sep 5, 2018 at 23:08

Mark

92.6k8 gold badges116 silver badges156 bronze badges

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

8 Comments

J Quest Over a year ago

I just tried your example but that gave me the error: app.js:96 Uncaught TypeError: Cannot read property 'nl' of undefined

Pedro Simão Over a year ago

There are no differences between our answers. However, both are different from your code. Take a look and you'll notice that your code is accessing the wrong array position, because a misplaced ]

Mark Over a year ago

Then you need to make a complete example @JQuest . Because your error is saying data.data.mengsels_data['mengsels_label_'+counter_i] is undefined, but you just told us it wasn't.

J Quest Over a year ago

It isn't undefined, it makes it undefined when I place [sessionStorage.language] at the second, this even makes the first one undefined in my console.log. I will look if i can create a complete example.

J Quest Over a year ago

@MarkMeyer you saved my life!! that was the problem.

|

Pedro Simão · Accepted Answer · 2018-09-05 23:26:42Z

0

I think you misplaced a ]. Can you try the following code:

console.log(data.data.mengsels_data['mengsels_label_'+counter_i]);
console.log(data.data.mengsels_data['mengsels_label_'+counter_i][sessionStorage.language]);
console.log(sessionStorage.language);

If data.data.mengsels_data['mengsels_label_'+counter_i] is equal to Object {nl: "April", en: "April", de: ""}, then your second line should access the nl by using data.data.mengsels_data['mengsels_label_'+counter_i][sessionStorage.language].

answered Sep 5, 2018 at 23:26

Pedro Simão

3031 silver badge11 bronze badges

1 Comment

J Quest Over a year ago

This also doesn't work, i tried that before. Problem is very strange, i updated my question with more code.

Collectives™ on Stack Overflow

Get value of key from object using variable and object

2 Answers 2

8 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related