show csv file in flask template.html

rr28rizal · Nov-11-2017, 09:17 AM

Hello, I have a question.
I have python script that collect tweets from twitter and store it csv file.
how to show the csv file in index.html?
I use flask as framework.

**Larz60+** · Nov-11-2017, 12:15 PM

what have you tried so far?
what results have you had?

***snippsat*** · (This post was last modified: Nov-11-2017, 12:27 PM by snippsat.)

tablib is good as it can convert csv to html table.
Example email.csv:

Name,message,email
John Smith,Hello Mr. Smith,[email protected]
John Doe,Hello Mr. Doe,[email protected]
Ms. Foo,Hello Ms. Foo,[email protected]

from flask import Flask, render_template
import tablib
import os

app = Flask (__name__)
dataset = tablib.Dataset()
with open(os.path.join(os.path.dirname(__file__),'email.csv')) as f:
    dataset.csv = f.read()

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

if __name__ == "__main__":
    app.run()

Will display a html table when open browser,example output CodePen.

To get more control like adjusting CSS.
Can send htlm code into index.html with jinja.
I have written a test with this,can post it if interested.

rr28rizal · (This post was last modified: Nov-12-2017, 09:58 AM by rr28rizal.)

(Nov-11-2017, 12:15 PM)Larz60+ Wrote: what have you tried so far?
what results have you had?

I tried pandas and use this code

df = pd.read_csv("file.csv")
        df.to_html("detail.html")

but it just created a new html page, that also didn't really work cause I can't open it in flask server.
What I wanted to do is to show the csv table in index.html template.

(Nov-11-2017, 12:27 PM)snippsat Wrote: tablib is good as it can convert csv to html table.
Example email.csv:
Name,message,email
John Smith,Hello Mr. Smith,[email protected]
John Doe,Hello Mr. Doe,[email protected]
Ms. Foo,Hello Ms. Foo,[email protected]
from flask import Flask, render_template
import tablib
import os

app = Flask (__name__)
dataset = tablib.Dataset()
with open(os.path.join(os.path.dirname(__file__),'email.csv')) as f:
    dataset.csv = f.read()

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

if __name__ == "__main__":
    app.run()
Will display a html table when open browser,example output CodePen.

To get more control like adjusting CSS.
Can send htlm code into index.html with jinja.
I have written a test with this,can post it if interested.

how to send the "dataset.html" content to "index.html"??
I don't know how to use jinja, I'm really new to python programming

***snippsat*** · (This post was last modified: Nov-12-2017, 11:11 AM by snippsat.)

Quote:but it just created a new html page, that also didn't really work cause I can't open it in flask server.
What I wanted to do is to show the csv table in index.html template

The option here is to use Jupyter Notebook,
Notebooks can be shared for free without using a server examples here.

Quote:how to send the "dataset.html" content to "index.html"??
I don't know how to use jinja, I'm really new to python programming

Jinja is build into Flask,as it's made bye same author.
It's a way for getting stuff from a Flask server and out to client side(browser).

Here is the setup,
now have control over where in page it should be and size/color and more though CSS.

Folder setup:

tab_test\
  |-- app.py
  |-- email.csv
  templates\
    |-- index.html
  static\
    css\
      |-- style.css

app.py:

from flask import Flask, render_template
import tablib
import os

app = Flask (__name__)
dataset = tablib.Dataset()
with open(os.path.join(os.path.dirname(__file__),'email.csv')) as f:
    dataset.csv = f.read()

@app.route("/")
def index():
    data = dataset.html
    #return dataset.html
    return render_template('index.html', data=data)

if __name__ == "__main__":
    app.run()

index.html:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <link rel=stylesheet type=text/css href="{{ url_for('static', filename='css/style.css') }}"/>
  <title>Show CSV</title>
</head>
<body>
  <div class="table">
    {% block body %}
    {{ data|safe }}
    {% endblock %}  
  </div>
</body>
</html>

style.css:

.table {       
  position: absolute;
  font-size: 150%;
  width: 480px;
  height: 200px;
  z-index: 15;
  top: 20%;
  left: 50%;
  margin: -100px 0 0 -150px;
  background: rgb(236, 240, 204);
  }

rr28rizal · (This post was last modified: Nov-12-2017, 01:55 PM by rr28rizal.)

(Nov-12-2017, 11:11 AM)snippsat Wrote:
Quote:but it just created a new html page, that also didn't really work cause I can't open it in flask server.
What I wanted to do is to show the csv table in index.html template
The option here is to use Jupyter Notebook,
Notebooks can be shared for free without using a server examples here.

Quote:how to send the "dataset.html" content to "index.html"??
I don't know how to use jinja, I'm really new to python programming
Jinja is build into Flask,as it's made bye same author.
It's a way for getting stuff from a Flask server and out to client side(browser).

Here is the setup,
now have control over where in page it should be and size/color and more though CSS.

Folder setup:
tab_test\
  |-- app.py
  |-- email.csv
  templates\
    |-- index.html
  static\
    css\
      |-- style.css
app.py:
from flask import Flask, render_template
import tablib
import os

app = Flask (__name__)
dataset = tablib.Dataset()
with open(os.path.join(os.path.dirname(__file__),'email.csv')) as f:
    dataset.csv = f.read()

@app.route("/")
def index():
    data = dataset.html
    #return dataset.html
    return render_template('index.html', data=data)

if __name__ == "__main__":
    app.run()
index.html:
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <link rel=stylesheet type=text/css href="{{ url_for('static', filename='css/style.css') }}"/>
  <title>Show CSV</title>
</head>
<body>
  <div class="table">
    {% block body %}
    {{ data|safe }}
    {% endblock %}  
  </div>
</body>
</html>
style.css:
.table {       
  position: absolute;
  font-size: 150%;
  width: 480px;
  height: 200px;
  z-index: 15;
  top: 20%;
  left: 50%;
  margin: -100px 0 0 -150px;
  background: rgb(236, 240, 204);
  }

hey, it works.
Thank you so much. Smile

Hide/Show

morph10 · Jul-29-2020, 05:02 PM

Hello I have the same kind of issue. I am trying to open a CSV and display it in html. I have done the above code leading it to my csv. The problem is it just returns none on a blank screen.
Now if I remove html from data = dataset.html (changed to -'data = dataset)it displays my CSV on screen, but I cannot do anything with it and it is not in table format.
What do you think could be wrong?

humanz · Nov-09-2020, 01:32 PM

iam getting this error
AttributeError: 'Dataset' object has no attribute 'html'

adamabusamra · Apr-12-2021, 09:24 AM

(Nov-09-2020, 01:32 PM)humanz Wrote: iam getting this error
AttributeError: 'Dataset' object has no attribute 'html'

In the documentation it says:

Quote:"This format is optional, install Tablib with pip install "tablib[html]" to make the
format available."

It worked for me.

here's the reference: https://tablib.readthedocs.io/en/stable/formats/#html

Possibly Related Threads…
Thread		Author	Replies	Views	Last Post
	Flask - use bootstrap styles in HTML	Krayna	1	1,050	Aug-29-2023, 02:33 PM Last Post: menator01
	Python Obstacles \| Kung-Fu \| Full File HTML Document Scrape and Store it in MariaDB	BrandonKastning	5	2,879	Dec-29-2021, 02:26 AM Last Post: BrandonKastning
	Show HTML in Python application and handle click	SamHobbs	2	2,718	Sep-28-2021, 06:27 PM Last Post: SamHobbs
	HTML multi select HTML listbox with Flask/Python	rfeyer	0	4,617	Mar-14-2021, 12:23 PM Last Post: rfeyer
	Flask do not accept sub-folder in Template ?! : Solved	SpongeB0B	2	3,399	Jan-15-2021, 08:09 AM Last Post: ndc85430
	API auto-refresh on HTML page using Flask	toc	2	11,837	Dec-23-2020, 02:00 PM Last Post: toc
	how to pass javascript variables to url_for function in a flask template	experimental	5	6,380	Oct-29-2020, 03:29 AM Last Post: universe
	Open and read a tab delimited file from html using python cgi	luffy	2	2,666	Aug-24-2020, 06:25 AM Last Post: luffy
	Flask formatting into HTML	engineer_geek	1	2,777	Aug-05-2020, 01:51 AM Last Post: engineer_geek
	flask How to output stderr and exceptions to log file	umen	4	4,759	Jun-20-2020, 06:11 AM Last Post: umen

show csv file in flask template.html

User Panel Messages

Announcements