I'm trying to pass list values (from 'ci' list below) into my wepage using python. The list values contain URLs for images which will go in the HTML <img src {{ listname[1] }} tag (see HTML below for more info). However, when I try the below code and render the template on my local server the img does not appear and when I inspect element the img src tag is empty.
My code is below:
Python
#app.route('/route', methods=['GET', 'POST'])
def _get_gallery():
df=pd.read_csv('C:\\username\\foldername\\excelfile.csv')
images=list(df["image"].values)
clean_images=[]
for image in images:
if "https" in str(image):
clean_images.append(image)
ci=pd.DataFrame(clean_images)
return render_template('template.html', ci=ci)
if __name__ == '__main__':
app.run(debug=True)
The HTML template has the following code to try and pull through the list values:
<div class="row">
<div class="col">
<a href="{{ ci[1] }}">
<img class="img" src="{{ ci[1] }}" alt="">
</a>
</div>
I think you don't need to convert the list to pandas DataFrame, try to comment this line and see if its work
Related
I've got the following code within my html template:
Template
<div class="submitbutton">
<a href="{% url 'accounts:customerhomepage' %}" target="_blank" value="1">
<button>
View Demo
</button>
</a>
</div>
I'd like to pass the value of 1 to the function in views.py that will render the page. Within the view, I've got the following code:
Views.py
demo = request.GET.get('value')
print(demo)
The printed result is 'None' rather than '1'. I'm not sure where my code is wrong.
Thanks!
I think you need to have "value" in a query string like so:
<a href="{% url 'accounts:customerhomepage' %}?value=1" target="_blank">
I have a little issue, that I'm not able to decide myself.
I'm using Django and trying to add this Python code:
{{ question.question_logo }}
that means "1", into HTML element this way:
<img id = image src ="{% static "polls/images/question_logos/{{ question.question_logo }}.jpg"%}/>
To check myself i tried:
<img id=i mage src="{% static " polls/images/question_logos/1.jpg " %}"/>
<h1>{{ question.question_logo }}</h1>
It works perfectly
I need to let HTML know somehow, that
{{ question.question_logo }}
is not a raw part of a link
Thank's for your time
Do this instead
<img id="image" src ="{% static "polls/images/question_logos/" %}{{ question.question_logo }}.jpg"/>
You need to put quotes around the id attribute as well.
This should work perfectly.
<img id ="image" src ="{% static "polls/images/question_logos/{{ question.question_logo }}.jpg" %}"/>
Basically I have a django template from which I show data about a document and I want a link to download the file. I tried something like this but it is not working:
<div class="metadata-container">
<div class="metadata-title">
<div>Version</div>
<div>Author</div>
<div>File</div>
</div>
<div class="metadata-content">
<div>{{ document.version }}</div>
<div>{{ document.author }}</div>
<a href=document.file download><div>{{ document.file }}</div>
</div>
</div>
The filename in format '/documents/2017/filename.txt' is in document.file variable or however it's called. How can I use it in the ? or how can I make it work?
You should write a method inside your Document model a method which should return the correct link to the file.
Similar to:
def get_document_url(self):
if self.file:
return '/documents/2017/ + self.file.name + ".txt"
And then inside html you can get it with:
<a href={{document.get_document_url}}>Link</a>
This question already has an answer here:
Reference template variable within Jinja expression
(1 answer)
Closed 6 years ago.
I'm making a simple music app.
I want to allow users upload their audio files and I have a page where I'm planning to show all songs.
I've created a template, and the structure looks like:
{% for song in songs %}
<div class="chart-item">
<div class="chart-position col-md-1">
<h3>#u</h3>
</div> <!-- chart-position -->
<div class="band-logo col-md-2">
<img src="{{ url_for('static', filename='uploads/users/{{ song['artistName'] }}/{{ song['pathToCover'] }}')}}">
</div> <!-- band-logo -->
<div class="band-name-and-autio col-md-9">
<div class="band-name">{{ song['artistName'] }} - {{ song['songName'] }}</div> <!-- band-name -->
<div class="audio">
<audio>
</audio>
</div> <!-- audio -->
</div> <!-- band-name-and-autio -->
<div class="clearfix"></div>
</div> <!-- chart-item -->
{% endfor %}
Here I want to make a dynamical path to cover image and a record, but I do not know to correctly write the path to the file here:
<img src="{{ url_for('static', filename='uploads/users/{{ song['artistName'] }}/{{ song['pathToCover'] }}')}}">
Please, explain how to do it. I've tried to find the solution on flask web page, but for now I have no any result.
I don't believe you can nest template tags like that. But you also shouldn't need to.
<img src="{{ url_for('static', filename='uploads/users/') }}{{ song['artistName'] }}/{{ song['pathToCover'] }}">
You can see why this works from the following example:
>>> from flask import Flask, url_for
>>> app = Flask(__name__)
>>> with app.test_request_context():
... print url_for('static', filename='uploads/users/')
/static/uploads/users/
So then you just need to add the artistName, /, pathToCover
I think you can do
<img src="{{ url_for('static', filename='uploads/users/'+ song['artistName']+'/'+ song['pathToCover'])}}">
It works for me :)
I am creating pages that display slides from a slideshow (which are stored as images called slide001.png, slide002.png, etc.) along with transcripts of the voiceover. The templates look like this:
<div class="transcript">
<p>Hello, and welcome to the first slide.</p>
<p>This is the second slide.</p>
<p>/...and so on...</p>
</div>
I want this translated into:
<div class="transcript">
<div class="slide">
<img src="slide001.png"/>
<p>Hello, and welcome to the first slide.</p>
</div>
...and so on for each slide...
</div>
i.e., each paragraph is wrapped in a div, and an img element is inserted with a consecutively-numbered image reference. I'm doing this with JavaScript right now, but since I'm using Jinja2 to do other things (insert consistent headers and footers, creating forward/back links, etc.), I was hoping I could do the wrap-and-enumerate in Jinja2 as well. Is it possible without heroic hackery?
If you can get the data into the following format in your page then it can be rendered quite nicely.
transcript = [{'image': 'filepath', 'text':'welcome...'},
{'image': 'filepath2', 'text':'slide2'},
{'image': 'filepath3', 'text':'slide3'}]
The Jinja can placed inline or moved to a macro but this will do the trick either way:
<div class="transcript">
{% for slide in transcript %}
<div class="slide">
<img src="{{ slide.image }}"/>
<p>{{ slide.text }}</p>
</div>
{% endfor %}
</div>