Another problem with local weather zipline

I am trying to implement changing the temperature displayed from Fahrenheit to Celsius but can’t seem to get it to display a change in selection of my radio buttons. However, when I press the Fahrenheit radio button, my message does not display as the condition never seems to be true.

The html code is

div id = "data">
  <h4>You are here:</h4>
  <p class="message"> the</p> 
  
</div>
 
<div class="card" style="width:20rem;">
<img class="card-img-top img-fluid" id="imageid" src="https://cdn.pixabay.com/photo/2017/05/09/16/06/windsurfing-2298647__340.jpg" alt="Card image" alt="Card image cap">
<div class="card-body">
  <h2 class="card-title" id="loc"> jkl;kj</h2>


 **<form>**
**    <input type="radio" name="tscale" id="fscale" value="ft"> Fahrenheit<br>**
**    <input type="radio" name="tscale" id="cscale" value="ct"> Celsius<br>**
** <input type="radio" name="tscale" id="kscale" value="kt"> Kelvin<br>**
**  </form>**
                                                                          
</div>
</div>

and the Javascript code is:

var xcoord;
var ycoord;


if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
  xcoord = position.coords.longitude;
  ycoord = position.coords.latitude;
console.log ("the x coord is: ", xcoord, " and the y coord is: ", ycoord);
  $.getJSON("https://fcc-weather-api.glitch.me/api/current?lon=" + xcoord + "&lat=" + ycoord, function(json) {
  $(".message").html(JSON.stringify(json));
    var tempcel = json.main.temp;
    var tempfah = Math.round(1.8 * tempcel + 32);
    var windspeedkts = json.wind.speed;
    var conditions = json.weather[0].description;
    var city = json.name;
    var country = json.sys.country;
    console.log('the Temp is ', tempcel, "C or ", tempfah, "F");
    console.log('the wind speed is ', windspeedkts, " knots");
    console.log('the weather is ', conditions);
    console.log('the location is ', city, " in ", country);
    console.log("the weather icon is: ", json.weather[0].icon);
    document.getElementById("imageid").src=json.weather[0].icon;
    if (**document.getElementById('fscale').checked**) {document.getElementById("loc").innerHTML = "The current weather for " + json.name + " in " + json.sys.country + " is " + json.weather[0].description + ", the Temp is " + tempfah + " and the wind speed is " + json.wind.speed + " knots.";}
       
      });
  
  
});
}

Matt

How does the code get the latest weather after you press a radio button?

research :stuck_out_tongue:
https://stackoverflow.com/questions/596351/how-can-i-know-which-radio-button-is-selected-via-jquery

1 Like