Hanzawa Naoki
Hanzawa Naoki

Reputation: 503

jQuery JSON API not working

Hi i am currently working on a small project where I am supposed to query a JSON API with the format

{
  "results": [
    {
      "livingstd": "80%",
      "place": "ClassA"
    },
    {
      "livingstd": "50%",
      "place": "ClassC"
    }
    ...
  ]
}

I am supposed to show the livings td whenever i hover over to a mini house icon.

so i wrote a javascript but it doesnt work. and I dont understand what went wrong. Can anyone shed some light on this? It doesn't show anything at all

<script type="text/javascript" src="js/function1.js"></script>
    <script>
    $(document).ready(function (e) {

        //api url
        var url = "dummyurl";
        //store search term
        var query;

        //when the user hover over
        $("button").hover(function (e) {
            //get value and store in variable
            query = $("#query").val();
            //get the json file
            $.getJSON(url + query, function (json) {
                $.each(json.results, function (i, occupancy) {
                    $("results").append('<p>' + occupancy.occupancy + 'at' + occupancy.time + '</p>')
                });
            });
        });
    });

</script>

Upvotes: -1

Views: 73

Answers (1)

hlfcoding
hlfcoding

Reputation: 2542

Did you look at the line that reads var url = "dummyurl";?

Also look at if your url and query are properly separated by a /. You can add query vars with '?' + $.param(queryObj).

Also if you look at the docs for hover, only giving one handler to hover means it gets called on mouseenter and mouseleave. Although that shouldn't prevent your code from working.

Upvotes: 1

Related Questions