0

so I've been fooling around with the Dark Sky Forecast API and I was able to get the weather of my own location be displayed onto a webpage. However I hard coded the longitude and latitude and I wanted to take it one stop further and let the user input their own. This is where it stopped working.

Before my code was simply just

                <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
                <script>
                //Waits until document is ready to run
                jQuery(document).ready(function($) {
                    //Beginning of code
                    //Makes the request
                    $.ajax({
                    url : "https://api.darksky.net/forecast/MyKey/1111,-1111+?exclude=minutely,hourly,daily,alerts,flags",
                    dataType : "jsonp",
                    success : function(parsed_json) {
                    var location = parsed_json['timezone'];
                    var temp_f = parsed_json['currently']['temperature'];
                    var complete = ("Current temperature in " + location + " is: " + temp_f);
                    $('#random').html("<h1>" + complete + "</h1>")
                    }
                    });
                    }
                });

                </script>

                    $('#search').click(getInfo);
                });

                </script>

And then I created some HTML fields (I used bootstrap just to keep things tidy) like this

                        <div class="input-group input-group-lg">
                        <input id="long" type="text" class="form-control" placeholder="Longitude" aria-describedby="sizing-addon1">
                    </div>

                    <div class="input-group input-group-lg">
                        <input id="lat" type="text" class="form-control" placeholder="Latitude" aria-describedby="sizing-addon1">
                    </div>

                    <div class="rand">
                    <button class="btn btn-primary btn-lg" role="button" id="search">Find my location and temperature!</button>
                    </div>

And I updated my script to look like this

                     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
                <script>
                //Waits until document is ready to run
                jQuery(document).ready(function($) {
                    //Beginning of code

                    var getInfo = function(){
                        //Grabs the longitude and latitude
                        var Longitude = $('#long').val();
                        var Latitude = $('#lat').val();
                        //Makes the request
                        $.ajax({
                        url : "https://api.darksky.net/forecast/mykey/" + Longitude + ","+ Latitude + "+?exclude=minutely,hourly,daily,alerts,flags",
                        dataType : "jsonp",
                        success : function(parsed_json) {
                        var location = parsed_json['timezone'];
                        var temp_f = parsed_json['currently']['temperature'];
                        var complete = ("Current temperature in " + location + " is: " + temp_f);
                        $('#random').html("<h1>" + complete + "</h1>")
                        }
                        });
                    }

                    $('#search').click(getInfo);
                });

However at this point it just doesn't work. I click my button and nothing happens. Maybe I did something wrong in the HTML portion because I barely made any changes to the script so I'm guessing that's not the problem.

Thank you so much!

1 Answer 1

-1

Nevermind, figured it out. I did everything right and I accidentally put a plus sign in the url... oops.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.