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

1 Expert Approved Answer
Step: 1 Unlock blur-text-image
Question Has Been Solved by an Expert!

Get step-by-step solutions from verified subject matter experts

Step: 2 Unlock
Step: 3 Unlock

Students Have Also Explored These Related Databases Questions!