How to assign a variable into a javascript src script in yahoo weather

The following code works fine but I am trying to have it receive input from a html form to choose any location from the form. See: text='chicago,il' I wish to have it receive the variable text='location'

<script>
  var callbackFunction = function(data) {
    var wind = data.query.results.channel.wind;
    alert(wind.chill);
  };
</script>

<script src="https://query.yahooapis.com/v1/public/yql?q=select wind from weather.forecast where woeid in (select woeid from geo.places(1) where text='chicago, il')&format=json&callback=callbackFunction"></script>

Some of my attempts:

<!DOCTYPE html>
<html>

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
        <script>
            function getLocation() {
                var city = document.getElementById("city").value;
                var country = document.getElementById("country").value;
                var location = city + "," + country;
                //alert(location);
            }
            var callbackFunction = function(data) {
                var wind = data.query.results.channel.wind;
                document.write(wind.chill)  
                alert(wind.chill);
                };



        </script>

    <script src="https://query.yahooapis.com/v1/public/yql?q=select * from weather.forecast where woeid in (select woeid from geo.places(1) where text='location')&format=json&callback=callbackFunction"></script>

    </head>


    <body>
        <input type="text" id="city">
        <input type="text" id="country"
        <button onclick="getLocation()">Get Weather</button>
    </body>
</html>

I have also tried other methods, but even when I assign var location a string directly, like location="new york, ny" or "\'new york,ny\'" etc it does not bring back a value. Please help, thank you.

Solution

Basically you need to load the yahooapis script AFTER you get the values from the form. Right now, the script will just be loaded when your page loads, which will not work. Fortunately, you can use javascript to add script elements to your page.

function getLocation() {
   var city = document.getElementById("city").value;
   var country = document.getElementById("country").value;
   var location = city + "," + country;

    //create a script and add it to your page
    var script = document.createElement('script');
    script.src = "https://query.yahooapis.com/v1/public/yql?q=select * from weather.forecast where woeid in (select woeid from geo.places(1) where text='" + location + "')&format=json&callback=callbackFunction";
    document.getElementsByTagName('head')[0].appendChild(script);

}