Question: /* global ajax */ var container = document.getElementById('container'); var url = http://api.openweathermap.org/data/2.5/weather?q=; var city = San Bernardino; var apiKey = 8cb58c3fd5422fa61da14a9fa9708fff; // Replace APIKEY with
<---this is my html code can you edit in it please and finish it !-->
(Modify index.html to contain a text box for the user to type in a city and a submit button. When the user types a city into the textbox and then clicks the submit button, the page should update with new weather information for that city. )
.......................................................................................................................................................................................................................................................................................
//ajax.js as reference function ajax(url, handler) { var req = new XMLHttpRequest(); if (!req) { alert('Browser not supported.'); return; }
req.onreadystatechange = function() { var resp; if (this.readyState === XMLHttpRequest.DONE) { if (this.status === 200) { resp = this.responseText; handler(resp); } else { handler('Ajax error, status: ' + this.status); } } }; req.open('GET', url); req.send(); }
................................................................................................................................................................................................................................................................................
//parse-response.js as reference
function parseResponse(responseText) { var response = JSON.parse(responseText); var condition = response.weather[0].main; var city = response.name; var country = response.sys.country; var degK = response.main.temp; //temperature data is in Kelvin var degF = 1.8*(degK - 273) + 32; //Converting Kelvin to Fahrenheit. degF = Math.floor(degF); //removing decimals var weatherBox = document.getElementById("weather"); response = city + ", " + country + " " + degF + "\u{00B0}" +" F " + condition; return response; }
Step by Step Solution
There are 3 Steps involved in it
Get step-by-step solutions from verified subject matter experts
