Question: Summary YOU MAY WORK IN GROUPS FOR THIS ASSIGNMENT. IN FACT, I SUGGEST THAT YOU DO. In this assignment, you will work with AJAX queries.
Summary
YOU MAY WORK IN GROUPS FOR THIS ASSIGNMENT. IN FACT, I SUGGEST THAT YOU DO.
In this assignment, you will work with AJAX queries. As you complete this assignment I strongly suggest that you refer back to my example (IS360AjaxXmlJson.html) and use it as a template to complete your work. You will create YQL and NWS queries that return both XML and JSON. For the NWS queries, you can use my token or get your own. Following is my token:
req.setRequestHeader("token", "vczOaCmkCxBVQHkKGXeVcGoNcrzjdBab")
Also, make sure that your output is well-formatted. You must use Bootstrap to format the tables and other elements. In addition, all of the tables should have column headers. Any and all input widgets must have prompts and be well-formatted.
For the NWS queries, refer to the following link for Web service reference:
https://www.ncdc.noaa.gov/cdo-web/webservices/v2#gettingStarted (Links to an external site.)Links to an external site.
All of your queries must be processed asynchronously. As mentioned in class, I suggest that you develop the code to operate synchronously. Then, once you get things working, convert the code to operate asynchronously.
You must allow the user to select the limit and offset for each NWS query that you write.
If you look through the assignment, you will see that there are tasks that you perform over and over again. If you build the code correctly, you can create and include a JavaScript.js file into the different pages and put the shared code there.
Index.html
The index html page does nothing other than link to the remaining pages.
YQLgeoPlaces.html
This query should be fashioned out of my query from the in-class example. (btnYQLShowPlacesXML). My example displayed, in a table, the place name, code, longitude, and latitude.
You need to display the following data points.
For this query, you MUST return the data as XML. You cannot use JSON. In my example, I hard coded the place name 'California'. You must use an input widget so that the user can enter the place name.
Use string concatenation to build the query string.
Your table must have column headers.
If the user enters a place name that does not return any results, then do not create the dynamic table, instead, display text that will advise the user what went wrong.
NWSQuery1
For this query, you will use the National Weather Service's Web service discussed in class. The Web service is designed such that there are about 20 location categories. Each location belongs to a location category. The following links describe the parameters:
https://www.ncdc.noaa.gov/cdo-web/webservices/v2#locationCategories (Links to an external site.)Links to an external site.
https://www.ncdc.noaa.gov/cdo-web/webservices/v2#locations (Links to an external site.)Links to an external site.
Create a query that will retrieve all of the locationcategories into a
And you can modify the DOM with something like the following:
var x = document.getElementById("mySelect"); var option = document.createElement("option"); option.text = "Kiwi"; x.add(option);
You need to need to register the onchange() for the
Based on the above selected item, create a second query that will select the locations that apply to the selected location category from the above
"https://www.ncdc.noaa.gov/cdo-web/api/v2/locations&locationcategoryid=CITY"
Display the results of this query into a table using the same techniques presented in class. This table should look like the table from the previous query.
NWSQuery2.html
For this query, you will again use the National Weather Service's Web service discussed in class.
In the previous query, you worked with the location and locationcategory endpoints. This page should work similarly and have a similar user interface.
The endpoints for this query are named datacategories and datatypes. If you look at the reference page, you will see that the datatypes endpoint accepts a parameter named datacategoryid. the Tarameter value contains one of the values from the datacategories tab.
Use a
NWSQuery3.html
Here is where you can put everything together and get the recorded observation data. The following URL documents the parameters.
https://www.ncdc.noaa.gov/cdo-web/webservices/v2#data (Links to an external site.)Links to an external site.
For this query, you may use the dataset named GHCND, which contains daily summary data.
Using the code from the previous pages, create the query to filter records by datatypeid, locationid, startdate, enddate,
Develop the user interface as you see fit, but the user should be able to select the data using one, two, three, or all four parameters.
Display the results in a table as you have been doing.
Deliverables
The deliverables are the same as always, Post the link to your web site in a folder named Assignment6. If you work in a group, submit only one assignment. List the names of the group members on the home (index.html) page and I'll propagate the grades.
Assessment
(30 points) Correctness of Query1. Async implemented. Operation of drop-down boxes. Query creation. Parsing the return data accurately.
(30 points) Correctness of Query2. Async implemented. Operation of drop-down boxes. Query creation. Parsing the return data accurately.
(30 points) Correctness of Query3. Operation of drop-down boxes. Query creation. Parsing the return data accurately.
(30 points) Good general user interface design and use of Bootstrap. Tables well-formatted and well aligned. Similar look-an-feel across the various pages.
Step by Step Solution
There are 3 Steps involved in it
Get step-by-step solutions from verified subject matter experts
