Lab Session: Weather Data: Difference between revisions

From NSB App Studio
Jump to navigation Jump to search
No edit summary
No edit summary
 
(3 intermediate revisions by 2 users not shown)
Line 5: Line 5:
# Open LabWeather.nsx.
# Open LabWeather.nsx.
# Add a click event to ''btnLoad'' on ''frmMain''
# Add a click event to ''btnLoad'' on ''frmMain''
# Have the click event use the value from ''txtCity'' to query OpenWeatherMap's API: http://api.openweathermap.org/data/2.5/weather?q=Riyadh,sa&callback=weatherData
# OpenWeatherMaps requires an API key. Use appid = "2de143494c0b295cca9337e1e96b00e0"
# Have the click event use the value from ''txtCity'' to query OpenWeatherMap's API: <br>http://api.openweathermap.org/data/2.5/weather?q=Riyadh,sa&appid=2de143494c0b295cca9337e1e96b00e0&callback=weatherData
#* Keep in mind that you should URL encode any user entered parameters, like city, using [https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent encodeURIComponent]
#* Keep in mind that you should URL encode any user entered parameters, like city, using [https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent encodeURIComponent]
#* Make sure you're using JSONP to make this request.
#* Make sure you're using JSONP to make this request.

Latest revision as of 15:48, 4 December 2015

In this lab you will pull in some weather data from http://openweathermap.org/API.

Student Outline

  1. Open LabWeather.nsx.
  2. Add a click event to btnLoad on frmMain
  3. OpenWeatherMaps requires an API key. Use appid = "2de143494c0b295cca9337e1e96b00e0"
  4. Have the click event use the value from txtCity to query OpenWeatherMap's API:
    http://api.openweathermap.org/data/2.5/weather?q=Riyadh,sa&appid=2de143494c0b295cca9337e1e96b00e0&callback=weatherData
    • Keep in mind that you should URL encode any user entered parameters, like city, using encodeURIComponent
    • Make sure you're using JSONP to make this request.
  5. Upon receiving the response, you should parse the response into the various Value labels on frmMain. The format of the response is described here: http://bugs.openweathermap.org/projects/api/wiki/Weather_Data

Bonus

  • The weather API has a lot of functionality that we aren't using. Create new forms and fields to return and display either forecast data, historical data, or both.
  • The city field requires a fairly exact name. If you'd like to allow for mistakes and abbreviations, you can integrate the city search api. This returns a list of possible city matches. One way to use this is to present a list that the user can choose from in a new form.