Forums

Uncaught TypeError: jQuery.getJSON is not a function

I am trying to use AJAX with Flask. I have the full version of the jQuery library declared in my html file. Yet, I see the above error in my browser console. I also tried calling the function with $.getJSON but I got the same result. Here is the function that gives me the error:

            function update_values() {
                    $SCRIPT_ROOT = {{ request.script_root|tojson|safe }};
                    $.getJSON($SCRIPT_ROOT+"/_headingrow", function(data) {
                    $("#last_price").text(data.last_price)});
                }

Any help would be greatly appreciated.

deleted-user-979132 | 3 posts | Nov. 15, 2017, 1:38 p.m. | permalink

that sounds like either you don't have the full version of jquery, or that function is being called before jquery is loaded.

Staff conrad | 4232 posts | PythonAnywhere staff | Nov. 16, 2017, 11:35 a.m. | permalink

Thanks for your response. I have the full version of the jquery library (see below snippet) and it's loaded before the function call. 

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<title>Title</title>
</head>
<body>
    <script>
        $SCRIPT_ROOT = {{ request.script_root|tojson|safe }};
        (function(){
            $.getJSON(
                $SCRIPT_ROOT+"/_specialroute", 
                function(dataABR) {
                    $("#var1").text(dataABR.var1)
                    $("#var2").text(dataABR.var2)
                    console.log(dataABR)
                }
            );
            setTimeout(arguments.callee, 10000);
        })();

    </script>
<!-- The rest of the html document starts here -->

My ultimate goal is to update certain bits of the page (var1 and var2) every 10 seconds with the updated data from my database. The page loads fine for the first time and the variables are correctly displayed thanks to the console.log(dataABR) call. However, after the first 10 seconds, I get the error message on the console saying that $.getJSON is not a function. I googled and stackoverflow-ed but was unable to find a solution to my problem.

This is a jquery error rather than a python error so maybe this forum is not the right place to ask this. But any help would be greatly appreciated.

deleted-user-979132 | 3 posts | Nov. 16, 2017, 12:55 p.m. | permalink

I made another test and cleaned up my code. It is working as intended now. Apparently some other code is messing things up. So far the following html page works as intended. 

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<title>Title</title>
</head>
<body>
    <script>
        $SCRIPT_ROOT = {{ request.script_root|tojson|safe }};
        (function(){
            $.getJSON(
                $SCRIPT_ROOT+"/_specialroute", 
                function(dataABR) {
                    $("#var1").text(dataABR.)
                    console.log(dataABR)
                }
            );
            setTimeout(arguments.callee, 10000);
        })();

    </script>

<p>Variable 1 is <span id="var1"></span></p>


</body>
</html>
deleted-user-979132 | 3 posts | Nov. 16, 2017, 1:58 p.m. | permalink

great! maybe something else is overwriting $

Staff conrad | 4232 posts | PythonAnywhere staff | Nov. 16, 2017, 5:48 p.m. | permalink