Ufdjrw

Writing in a Christian voice

Did I make a mistake by ccing email to boss to others?

categorizing a variable turns it from insignificant to significant

is this saw blade faulty?

New Order #2: Turn My Way

Why is participating in the European Parliamentary elections used as a threat?

Why doesn't Gödel's incompleteness theorem apply to false statements?

Mortal danger in mid-grade literature

Magnifying glass in hyperbolic space

What is the tangent at a sharp point on a curve?

If the Dominion rule using their Jem'Hadar troops, why is their life expectancy so low?

Why is implicit conversion not ambiguous for non-primitive types?

PTIJ: Which Dr. Seuss books should one obtain?

Taking my research idea outside my paid job

How would a solely written language work mechanically

Highest stage count that are used one right after the other?

Why would five hundred and five same as one?

Travelling in US for more than 90 days

What is the meaning of "You've never met a graph you didn't like?"

How do I lift the insulation blower into the attic?

Recursively move files within sub directories

Trouble reading roman numeral notation with flats

Would this string work as string?

How can I, as DM, avoid the Conga Line of Death occurring when implementing some form of flanking rule?

How to pass data that is non JSON serializable from flask to javascript file?

Why can't Python parse this JSON data?Peak detection in a 2D arrayHow to make a class JSON serializableHow can I pretty-print JSON using JavaScript?How to POST JSON data with Curl from Terminal/Commandline to Test Spring REST?How to get data received in Flask requestHow to overcome “datetime.datetime not JSON serializable”?How do I write JSON data to a file?How to prettyprint a JSON file?Return JSON response from Flask view

-2

In my server.py, I have a list that keeps track of names:

data = [
"Jim",
"Stanley",
"Michael",
"Kevin",
"Kelly"
]

doing tojson doesn't work for me because data in this format is not serializable. Doing return render_template('ppc.html', data=data)also doesn't seem to let the js file access data in server.py. I also tried 'data'this format sugested in some posts but none of those seem to work. Does anyone have any other way?

python json flask

share|improve this question

edited Mar 7 at 15:03

davidism

65.4k12175189

asked Mar 7 at 0:52

user7544590user7544590

227

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  What do you mean by "non-serializable", exactly? And why would a simple list of strings not be that?
  
  – Lightness Races in Orbit
  Mar 7 at 0:54
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  it is a type error give by python. JSON serializable data is like "name": name
  
  – user7544590
  Mar 7 at 0:56
  

  
  
  
  


• 
  
  
  

  
  2
  

  
  
  
  
  
  

  
  
  Present your Minimal, Complete, and Verifiable example, clearly describing your goal, your attempt, your expectation, the instead result, and any pertinent details.
  
  – Lightness Races in Orbit
  Mar 7 at 1:16
  

  
  
  
  

add a comment | 

-2

In my server.py, I have a list that keeps track of names:

data = [
"Jim",
"Stanley",
"Michael",
"Kevin",
"Kelly"
]

doing tojson doesn't work for me because data in this format is not serializable. Doing return render_template('ppc.html', data=data)also doesn't seem to let the js file access data in server.py. I also tried 'data'this format sugested in some posts but none of those seem to work. Does anyone have any other way?

python json flask

share|improve this question

edited Mar 7 at 15:03

davidism

65.4k12175189

asked Mar 7 at 0:52

user7544590user7544590

227

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  What do you mean by "non-serializable", exactly? And why would a simple list of strings not be that?
  
  – Lightness Races in Orbit
  Mar 7 at 0:54
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  it is a type error give by python. JSON serializable data is like "name": name
  
  – user7544590
  Mar 7 at 0:56
  

  
  
  
  


• 
  
  
  

  
  2
  

  
  
  
  
  
  

  
  
  Present your Minimal, Complete, and Verifiable example, clearly describing your goal, your attempt, your expectation, the instead result, and any pertinent details.
  
  – Lightness Races in Orbit
  Mar 7 at 1:16
  

  
  
  
  

add a comment | 

In my server.py, I have a list that keeps track of names:

data = [
"Jim",
"Stanley",
"Michael",
"Kevin",
"Kelly"
]

doing tojson doesn't work for me because data in this format is not serializable. Doing return render_template('ppc.html', data=data)also doesn't seem to let the js file access data in server.py. I also tried 'data'this format sugested in some posts but none of those seem to work. Does anyone have any other way?

python json flask

share|improve this question

edited Mar 7 at 15:03

davidism

65.4k12175189

asked Mar 7 at 0:52

user7544590user7544590

227

data = [
"Jim",
"Stanley",
"Michael",
"Kevin",
"Kelly"
]

share|improve this question

edited Mar 7 at 15:03

davidism

65.4k12175189

asked Mar 7 at 0:52

user7544590user7544590

227

share|improve this question

edited Mar 7 at 15:03

davidism

65.4k12175189

asked Mar 7 at 0:52

user7544590user7544590

227

edited Mar 7 at 15:03

davidism

65.4k12175189

edited Mar 7 at 15:03

davidism

65.4k12175189

asked Mar 7 at 0:52

user7544590user7544590

227

asked Mar 7 at 0:52

user7544590user7544590

227

1 Answer
1

active

oldest

votes

0

Use jsonify method. It will enable returning list from view. Documentation for jsonify.

Here is an example of how to load data in template using Javascript.

Folder structure:

├── app.py
├── static
│   └── demo.js
└── templates
    └── simple.html

app.py:

from flask import Flask, render_template, jsonify

app = Flask(__name__)

@app.route("/get_data", methods=['GET'])
def get_data():
 data = ["Captain America", "Hulk", "Thor", "Wolverine"]
 return jsonify(data)

@app.route("/")
def index():
 return render_template("simple.html")

app.run(debug=True)

simple.html:

<html>
 <head>
 <title>Marvel Characters</title>
 </head>
 <body>
 <h3>List of Marvel Characters loaded from JS</h3>
 <div id="result"></div>
 <script src=" url_for('static', filename='demo.js') "></script> 
 </body>
</html>

demo.js:

window.addEventListener("load", function()
 var xhttp = new XMLHttpRequest();
 xhttp.onreadystatechange = function() 
 if (this.readyState == 4 && this.status == 200) 
 var data = JSON.parse(this.responseText);
 var result = document.getElementById("result");
 for(var i=0;i<data.length; i++)
 result.innerHTML += data[i]+"<br>";
 
 
 ;
 xhttp.open("GET", "/get_data", true);
 xhttp.send();
);

Output:

share|improve this answer

edited Mar 7 at 6:11

answered Mar 7 at 4:31

arshoarsho

3,67211733

add a comment | 

Your Answer

StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55034434%2fhow-to-pass-data-that-is-non-json-serializable-from-flask-to-javascript-file%23new-answer', 'question_page');

);

Post as a guest

Name

Email

Required, but never shown

0

Use jsonify method. It will enable returning list from view. Documentation for jsonify.

Here is an example of how to load data in template using Javascript.

Folder structure:

├── app.py
├── static
│   └── demo.js
└── templates
    └── simple.html

app.py:

from flask import Flask, render_template, jsonify

app = Flask(__name__)

@app.route("/get_data", methods=['GET'])
def get_data():
 data = ["Captain America", "Hulk", "Thor", "Wolverine"]
 return jsonify(data)

@app.route("/")
def index():
 return render_template("simple.html")

app.run(debug=True)

simple.html:

<html>
 <head>
 <title>Marvel Characters</title>
 </head>
 <body>
 <h3>List of Marvel Characters loaded from JS</h3>
 <div id="result"></div>
 <script src=" url_for('static', filename='demo.js') "></script> 
 </body>
</html>

demo.js:

window.addEventListener("load", function()
 var xhttp = new XMLHttpRequest();
 xhttp.onreadystatechange = function() 
 if (this.readyState == 4 && this.status == 200) 
 var data = JSON.parse(this.responseText);
 var result = document.getElementById("result");
 for(var i=0;i<data.length; i++)
 result.innerHTML += data[i]+"<br>";
 
 
 ;
 xhttp.open("GET", "/get_data", true);
 xhttp.send();
);

Output:

share|improve this answer

edited Mar 7 at 6:11

answered Mar 7 at 4:31

arshoarsho

3,67211733

add a comment | 

0

Use jsonify method. It will enable returning list from view. Documentation for jsonify.

Here is an example of how to load data in template using Javascript.

Folder structure:

├── app.py
├── static
│   └── demo.js
└── templates
    └── simple.html

app.py:

from flask import Flask, render_template, jsonify

app = Flask(__name__)

@app.route("/get_data", methods=['GET'])
def get_data():
 data = ["Captain America", "Hulk", "Thor", "Wolverine"]
 return jsonify(data)

@app.route("/")
def index():
 return render_template("simple.html")

app.run(debug=True)

simple.html:

<html>
 <head>
 <title>Marvel Characters</title>
 </head>
 <body>
 <h3>List of Marvel Characters loaded from JS</h3>
 <div id="result"></div>
 <script src=" url_for('static', filename='demo.js') "></script> 
 </body>
</html>

demo.js:

window.addEventListener("load", function()
 var xhttp = new XMLHttpRequest();
 xhttp.onreadystatechange = function() 
 if (this.readyState == 4 && this.status == 200) 
 var data = JSON.parse(this.responseText);
 var result = document.getElementById("result");
 for(var i=0;i<data.length; i++)
 result.innerHTML += data[i]+"<br>";
 
 
 ;
 xhttp.open("GET", "/get_data", true);
 xhttp.send();
);

Output:

share|improve this answer

edited Mar 7 at 6:11

answered Mar 7 at 4:31

arshoarsho

3,67211733

add a comment | 

Use jsonify method. It will enable returning list from view. Documentation for jsonify.

Here is an example of how to load data in template using Javascript.

Folder structure:

├── app.py
├── static
│   └── demo.js
└── templates
    └── simple.html

app.py:

from flask import Flask, render_template, jsonify

app = Flask(__name__)

@app.route("/get_data", methods=['GET'])
def get_data():
 data = ["Captain America", "Hulk", "Thor", "Wolverine"]
 return jsonify(data)

@app.route("/")
def index():
 return render_template("simple.html")

app.run(debug=True)

simple.html:

<html>
 <head>
 <title>Marvel Characters</title>
 </head>
 <body>
 <h3>List of Marvel Characters loaded from JS</h3>
 <div id="result"></div>
 <script src=" url_for('static', filename='demo.js') "></script> 
 </body>
</html>

demo.js:

window.addEventListener("load", function()
 var xhttp = new XMLHttpRequest();
 xhttp.onreadystatechange = function() 
 if (this.readyState == 4 && this.status == 200) 
 var data = JSON.parse(this.responseText);
 var result = document.getElementById("result");
 for(var i=0;i<data.length; i++)
 result.innerHTML += data[i]+"<br>";
 
 
 ;
 xhttp.open("GET", "/get_data", true);
 xhttp.send();
);

Output:

share|improve this answer

edited Mar 7 at 6:11

answered Mar 7 at 4:31

arshoarsho

3,67211733

├── app.py
├── static
│   └── demo.js
└── templates
    └── simple.html

from flask import Flask, render_template, jsonify

app = Flask(__name__)

@app.route("/get_data", methods=['GET'])
def get_data():
 data = ["Captain America", "Hulk", "Thor", "Wolverine"]
 return jsonify(data)

@app.route("/")
def index():
 return render_template("simple.html")

app.run(debug=True)

<html>
 <head>
 <title>Marvel Characters</title>
 </head>
 <body>
 <h3>List of Marvel Characters loaded from JS</h3>
 <div id="result"></div>
 <script src=" url_for('static', filename='demo.js') "></script> 
 </body>
</html>

window.addEventListener("load", function()
 var xhttp = new XMLHttpRequest();
 xhttp.onreadystatechange = function() 
 if (this.readyState == 4 && this.status == 200) 
 var data = JSON.parse(this.responseText);
 var result = document.getElementById("result");
 for(var i=0;i<data.length; i++)
 result.innerHTML += data[i]+"<br>";
 
 
 ;
 xhttp.open("GET", "/get_data", true);
 xhttp.send();
);

share|improve this answer

edited Mar 7 at 6:11

answered Mar 7 at 4:31

arshoarsho

3,67211733

answered Mar 7 at 4:31

arshoarsho

3,67211733

answered Mar 7 at 4:31

arshoarsho

3,67211733