Button functioning with a json object

JavaScript
1

I am trying to use an API to print out a json object. I can’t seem to get the simple button to work.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>weatherjson</title>
    <style>
        header {
            position: fixed;
            top: 0px;
            bottom: 15%;
            height: 15%;
            left: 0px;
            right: 100%;
            width: 100%;
            background-color: red;
        }

        body {
            position: fixed;
            top: 15%;
            bottom: 90%;
            height: 75%;
            left: 0px;
            right: 100%;
            width: 100%;
            background-color: green;
        }

        footer {
            position: fixed;
            top: 90%;
            bottom: 100%;
            height: 10%;
            left: 0px;
            right: 100%;
            width: 100%;
            background-color: blue;
        }
    </style>
</head>
<body>
    <script type="text/javascript">
        function btn1_click() {
            fetch('https://api.openweathermap.org/data/2.5/onecall?lat=40.79&lon=-81.347&exclude=minutely&appid=527162f90d').then(response => response.json()).then((obj) => {
                    console.log(typeof obj); // object (not json anymore)
                    console.log(obj);
                });
        }
    </script>
    <input id="Button1" type="button" value="get json" onclick="btn1_click()" />
    <input id="Textbox1" type="text" />
    <input id="Textbox2" type="text" />
</body>
</html>
2

Are you getting any error messages in the browser’s console? I would be sure to look there.

3

I am not getting any warnings. The button when pressed it does nothing. I am sure the api is right. Of course I changed the api code to protect my security.

4

I went ahead and created an account and got my own API key. When I use my key with your code it works and I am seeing the object logged to the console.

I used your code verbatim, just plugged in my own API key.

1 Like
5

I can get it to work in JSFiddle but not in Visual Studio 2017.

6

Again, what does “not work” mean here? Is there an error being logged to the console?

7

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.