-3

Why is the array undefined

My question is how do i get to display the objects inside the results array. I've tried console.log(data.results[0].bodyColor) and i get an error. When i try (data.results) i get undefined. when i try (data.results[0]) it gives responds with a error message. Why is the array undefined when i can see it on my console. [this is the console so how can i print out the value of the AirBagLocFront][1]

<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Untitled Document</title>
</head>

<body>
    <h2> Vehicle API</h2>
    <div id="div"></div>
    <script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
    <!--Jquery CDN-->
    <script>
        $.ajax({
            url: "https://vpic.nhtsa.dot.gov/api/vehicles/DecodeVINValuesBatch/",
            type: "POST",
            cache: true,

            data: {
                format: "json",
                data: "WBAPK5C52AA599960;"
            },
            dataType: "json",

            success: function(data) {

                console.log(data.results[0].AirBagLocFront);

            }
        });
    </script>
</body>

</html>
  • because the data structure isn't such that you can access the values in the way you are attempting to. Inspect the structure you are given and use it accordingly. *(javascript is case sensitive)* – Kevin B May 18 '17 at 17:43
  • The structure is a Json object and I thought you could just traverse as if it were a javascript object. I also changed results to Results and that also didn't work. – Jose Guzman May 18 '17 at 17:55
  • Yes, you can just traverse it like any other object, because that's all it is. It isn't json once you have access to it. – Kevin B May 18 '17 at 17:55
  • 1
    btw, [your image](https://i.stack.imgur.com/EvaCB.png) has been lost. giving us the result of a `JSON.stringify(data)` though in text form would be more useful. – Kevin B May 18 '17 at 17:58

2 Answers2

0

You have a typo in your code. You want Results, not results. Moreover, Results is an array containing a single object. You could traverse the entire data structure quite easily using a for...in loop. Here is a working snippet:

$.ajax({
  url: "https://vpic.nhtsa.dot.gov/api/vehicles/DecodeVINValuesBatch/",
  type: "POST",
  cache: true,
  data: {
    format: "json",
    data: "WBAPK5C52AA599960;"
  },
  dataType: "json",
  success: function(data) {
    var res = data.Results[0];
    for (var prop in res) {
      if (res.hasOwnProperty(prop)) {
        console.log(prop + ' - ' + (res[prop] ? res[prop] : 'N/A'));
      }
    }
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Badacadabra
  • 8,043
  • 7
  • 28
  • 49
0

<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Untitled Document</title>
</head>

<body>
    <h2> Vehicle API</h2>
    <div id="div"></div>
    <script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
    <!--Jquery CDN-->
    <script>
        $.ajax({
            url: "https://vpic.nhtsa.dot.gov/api/vehicles/DecodeVINValuesBatch/",
            type: "POST",
            cache: true,

            data: {
                format: "json",
                data: "WBAPK5C52AA599960;"
            },
            dataType: "json",

            success: function(data) {

                console.log(data['Results'][0]['BodyClass']);

            }
        }):
    </script>
</body>

</html>

This works the syntax i was using to access the nested object was incorrect. Thanks everyone.