Javascript $.get return data, dynamic select from data

Question

I have a $.get, which returns data that looks like this:

Object 
    filter_afmeting-breedte_cm: Object
        end_value: "200"
        max_value: "200"
        min_value: 0
        start_value: 0
    filter_afmeting-diepte_cm: Object
        end_value: "150"
        max_value: "150"
        min_value: 0
        start_value: 0

I can then select for example the end_value from filter_afmeting-breedte_cm with data.filter_afmeting-breedte_cm.end_value. That works. But the problem I have, is that the filter_afmeting-breedte_cm part is dynamic. I get these dynamic parts with a each, that looks like this:

$(".filter-js-slider").each(function(){
    var filter = $(this).attr("id");
});

The var filter is for example filled with filter_afmeting-breedte_cm. So with that dynamic var called filter, I need to select the right values from the data array. I tried data.+filter+.end_value, but this is not working. But I gives the right idea from what I want to get, I think.

In PHP it would look like this:

$filter = "filter_afmeting-breedte_cm"; (which would be dynamic filled)
echo $data[$filter]['min_value'];

But how do I get that to work in Javascript?

Answer 1

data[String(filter)].end_value

This is using javascripts ability to access property names by string instead of dot notation (which is obviously also supports).

Please see here: JavaScript object: access variable property by name as string for further information.