The JSON request object has not been defined

Question

The JSON request object has not been defined

I am currently facing an issue while trying to make a JSON request from the open weather API example. When I attempt to access the key value in the $.each method, it keeps showing that the value for the key is undefined. Can someone please review the code and help me identify what I am missing?

function getGs(data) {
  $.each(data.main,function(i,weather){
    console.log(weather.humidity);
  })
}

$(document).ready(function() {
  var bggAPI = "http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139?";
  
  $.ajax({
    dataType: "json",
    url: bggAPI
  });
  
  getGs();
  
});

javascript json

Answer 1

Answer №1

$.ajax initiates an asynchronous request.
After it successfully completes, the success function is triggered and you may have missed it.

data.main is not a list, but rather an object.
data.weather is a list.

function getGs(data) {
  console.log(data.main.humidity);
  $.each(data.weather,function(i, weather) {
    console.log(weather.main);
  })
}

$(document).ready(function() {
  var bggAPI = "http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139?";

  $.ajax({
    dataType: "json",
    url: bggAPI,
    success:getGs
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

$.ajax initiates an asynchronous request.
After it successfully completes, the success function is triggered and you may have missed it.

data.main is not a list, but rather an object.
data.weather is a list.

function getGs(data) {
  console.log(data.main.humidity);
  $.each(data.weather,function(i, weather) {
    console.log(weather.main);
  })
}

$(document).ready(function() {
  var bggAPI = "http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139?";

  $.ajax({
    dataType: "json",
    url: bggAPI,
    success:getGs
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 3

Answer №2

It seems like a simple issue, you have a typo in your code.

You have used wather as a parameter but are calling weather inside your function.

Update:

Upon reviewing your provided JSON data :

{ coord: { lon: 138.93, lat: 34.97 }, weather: [ { id: 800, main: "Clear", description: "Sky is Clear", icon: "01n" } ], base: "cmc stations", main: { temp: 300.37, pressure: 1015, humidity: 82, temp_min: 300.37, temp_max: 300.37 }, wind: { speed: 0.51, deg: 314, gust: 1.03 }, clouds: { all: 0 }, dt: 1438897427, sys: { type: 3, id: 10294, message: 0.0102, country: "JP", sunrise: 1438804655, sunset: 1438854132 }, id: 1851632, name: "Shuzenji", cod: 200 }

You have a weather array, however, you are iterating through the main property as an array when it is actually just a property within the weather array. Your corrected code should be:

$.each(data.weather,function(i,weather){
  console.log(weather.main);
  })
}

Answer 4

It seems like a simple issue, you have a typo in your code.

You have used wather as a parameter but are calling weather inside your function.

Update:

Upon reviewing your provided JSON data :

{ coord: { lon: 138.93, lat: 34.97 }, weather: [ { id: 800, main: "Clear", description: "Sky is Clear", icon: "01n" } ], base: "cmc stations", main: { temp: 300.37, pressure: 1015, humidity: 82, temp_min: 300.37, temp_max: 300.37 }, wind: { speed: 0.51, deg: 314, gust: 1.03 }, clouds: { all: 0 }, dt: 1438897427, sys: { type: 3, id: 10294, message: 0.0102, country: "JP", sunrise: 1438804655, sunset: 1438854132 }, id: 1851632, name: "Shuzenji", cod: 200 }

You have a weather array, however, you are iterating through the main property as an array when it is actually just a property within the weather array. Your corrected code should be:

$.each(data.weather,function(i,weather){
  console.log(weather.main);
  })
}

The JSON request object has not been defined

Answer №1

Answer №2

Similar questions

After Vue 3 <router-view> was built in history mode, it received comments

Creating an X pattern on an HTML5 canvas and detecting intersections with a perimeter

Using a basic string as the JSON response in a Spring REST controller

Is the Facebook AJAX Permissions Dialog displayed outside of a Pop-Up?

utilize the getStaticProps function within the specified component

JavaScript can be used to target and remove parent <tr> elements that contain empty <td> elements with a specific class

Having difficulties transmitting numerical values through res.send() in express with node

What is the counterpart of the JavaScript transport.responseText in jQuery's Ajax requests?

Selenium WebriverJS does not support right mouse button clicks in PhantomJS

What is the best way to verify the accuracy of a value in JavaScript as I move forward?

Assigning numerous key-value pairs as the value of a single key in AngularJS

Can you provide guidance on creating a JSON-LD Schema for a GeoShape Circle?

The browser does not store the cookie in the designated cookie tab within the application settings

Error encountered: Index 109 - The function $.ajax(...).success is not recognized as a valid function while working with jQuery in a Node

JavaScript Oddity - Array Increment Trick

How to extract parameters from an http get request in Node.js

What is the best way to have a variable adjust each time a coin is inserted until it reaches a specific value?

Tips for displaying an uploaded image using the Valums file uploader

A guide on assigning a value to an array within a formgroup

Encountering errors while running Angular 8's ng build prod command