CODEWITHSUNDEEP
javascriptjqueryjson
Ryan
Ryan

Reputation: 1432

Retrieving new data from JSON object not working?

alert(data.name); will not return the name of the data object, though alert(data.price); returns the price and keeps on returning prices, no matter what argument I pass to alert. I'm trying to figure out why. If you have any thoughts, please share. I'm completely new to this interesting, though seemingly opaque and tough to debug, language (i.e, JS/JQ).

I'm running the following code on the front-end to accept a ticker symbol from a user. Originally, the alert(); contained alert(data.price);, and it displayed the stock's price. I changed it to alert(data.name); and still got the price. I then changed it to alert('hello');, and it returned yet another (correct) stock price.

Front-End:

<!DOCTYPE html>

<html>
    <head>
        <script src="https://code.jquery.com/jquery-latest.min.js"></script>
        <script>
        /*global $*/

            /**
             * Gets a quote via JSON.
             */
            function quote()
            {
                var url = '/quote?symbol=' + $('#symbol').val();
                $.getJSON(url, function(data) {
                    alert(data.name);
                });
            }

        </script>
        <title>ajax0</title>
    </head>
    <body>
        <form onsubmit="quote(); return false;">
            <input autocomplete="off" autofocus id="symbol" placeholder="Symbol" type="text"/>
            <input type="submit" value="Get Quote"/>
        </form>
    </body>
</html>

On the back end, I am running the following code. It should provide me with a JSON object that gives me access to a stock's name, price, etc. via dot notation.

Back End:

import csv
import os
import urllib.request

from flask import Flask, jsonify, render_template, request
from flask.exthook import ExtDeprecationWarning
from warnings import simplefilter
simplefilter("ignore", ExtDeprecationWarning)
from flask_autoindex import AutoIndex

app = Flask(__name__)
AutoIndex(app, browse_root=os.path.curdir)

@app.route("/quote")
def quote():
    url = "http://download.finance.yahoo.com/d/quotes.csv?f=snl1&s={}".format(request.args.get("symbol"))
    webpage = urllib.request.urlopen(url)
    datareader = csv.reader(webpage.read().decode("utf-8").splitlines())
    row = next(datareader)
    return jsonify({"name": row[1], "price": float(row[2]), "symbol": row[0].upper()})

Upvotes: 0

Views: 99

Answers (2)

Ryan
Ryan

Reputation: 1432

While the exact nature of the bug remains somewhat elusive, WiseGuy (above) had the right idea. On every page (e.g., code window of web-based IDE, HTML form, etc) I ensured that "disable cache" was selected under the network tab in Chrome's developer tools. Additionally, I moved the following code from a prior project done in Flask to the back-end, so as to ensure no responses were cached. I also wiped my browser history and cache clean, as this bug has been haunting me for a couple of days, and I had to be certain I had covered all of my bases. This combination of steps achieved the desired result. 

# ensure responses aren't cached
if app.config["DEBUG"]:
    @app.after_request
    def after_request(response):
        response.headers["Cache-Control"] = "no-cache, no-store, must-revalidate"
        response.headers["Expires"] = 0
        response.headers["Pragma"] = "no-cache"
        return response

Upvotes: 0

Dhyey
Dhyey

Reputation: 4335

Try converting data to Javascript object as it is passed as JSON from backend, like this:

$.getJSON(url, function(data) {
   var resp = JSON.parse(data);
   console.log(resp) 
   alert(resp.name);
});

If this does not work then comment the resp from console.

Upvotes: 1

Related Questions