I am listing down the data coming from the database in a table. But it is not aligning as a table.
what I want to display in the web page is,
Name john mark
Faculty cs
University xxx
But what I get in the web page is,
Name john mark
Faculty cs
University xxx
In my .html I have,
{% for item in data %}
<tr>
<td>{{item[0]}}</td>
<td>{{item[1]}}</td>
</tr>
<br>
{% endfor %}
Please help me with this as I am new to python flask.
This is how valid table HTML should look.
You have not wrapped tr with <table> element.
<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
So your code should look like this.
<table>
{% for item in data %}
<tr>
<td>{{item[0]}}</td>
<td>{{item[1]}}</td>
</tr>
{% endfor %}
</table>
Try this html
<table>
<tbody>
{% for item in data %}
<tr>
<td>{{item[0]}}</td>
<td>{{item[1]}}</td>
</tr>
{% endfor %}
</tbody>
</table>
Related
What I am trying to do is to populate a html table with the same numbers of rows as entries in my dictionary.
I am passing my dictionary items as a context variable to the html.
I can show my dictionary items as follows:
{% for key,value in top_items.items %}
<ul>{{ key }}</ul>
{% endfor %}
But when I try an stick it into a table to create table rows, like below, it does not work. It seems to put them all in one row. Instead of making a new row for each item.
<table class="u-half-width">
<thead>
<tr>
<th>Column</th>
<th>Details</th>
</tr>
</thead>
<tbody>
<tr>
{% for key,value in top_items.items %}
<tr>{{ key }}</tr>
{% endfor %}
</tr>
</tbody>
</table>
Your HTML is invalid; you can't nest a <tr> inside another <tr>, and you don't have any <td>/<th> elements.
Try:
<tbody>
{% for key,value in top_items.items %}
<tr>
<th scope="row">{{ key }}</th>
<td>{{ value }}</td>
</tr>
{% endfor %}
</tbody>
I'm using HTML, CSS, and Javascript for the frontend and Django for the backend, and PostgresSQL for DB. Actually, I have successfully loaded data from the EXCEL file to Django and I'm trying to fetch data from Django to HTML Table. But, I'm getting only headers of the table, not the data. How to fix it.
index.html
{%extends "base.html"%}
{%block content%}
<html>
<table>
<thead>
<th>Brand</th>
<th>Name</th>
</thead>
<tbody>
<tr>
<td><strong>{{pro.brand}}</strong></td>
<td><strong>{{pro.name}}</strong></td>
</tr>
</tbody>
</table>
{%endblock%}
views.py
def product(request):
pro = Product.objects.all()
return render(request, 'index.html',{'pro': pro})
urls.py (App file)
urlpatterns = [
path('product/', views.product, name='product'),
]
because your context variable pro is a queryset(a list of instances), you have to do a loop in template like this:
{%extends "base.html"%}
{%block content%}
<html>
<table>
<thead>
<th>Brand</th>
<th>Name</th>
</thead>
<tbody>
{% for p in pro %}
<tr>
<td><strong>{{p.brand}}</strong></td>
<td><strong>{{p.name}}</strong></td>
</tr>
{% endfor %}
</tbody>
</table>
{%endblock%}
I'm working on a Django project but am relatively new to bootstrap and css.
I have a table with books inventory and its looking fine until there are records in them. But when there are no records, I want to display a placeholder "No books added yet."
I've tried multiple ways but I'm unable to do so.
This is my html file:
<table class="table table-hover table-bordered">
<thead class="thead-light">
<tr>
<th scope="col">Title</th>
<th scope="col">Author</th>
<th scope="col">Genre</th>
<th scope="col">Available</th>
<th scope="col">Add Date</th>
</tr>
</thead>
<tbody>
{% if books.count > 0 %}
{% for row in books %}
<tr>
<td>{{row.title}}</td>
<td>{{row.author}}</td>
<td>{{row.genre}}</td>
<td>{% if row.available %}Yes{% else %}No{% endif %}</td>
<td>{{row.date}}</td>
</tr>
{% endfor %}
{% else %}
<tr>
<td>No Books added yet !</td>
</tr>
{% endif %}
</tbody>
</table>
Doing so, the placeholder is just comimg on the first cell:
How to edit this so this cell shows as a complete row?
I'm using symfony and html2pdf bundle to generate a pdf file so here's the code that I used to display a table in the pdf file:
<table class="border" width="100%" align="center">
<thead>
<tr>
<th>Kilometrage</th>
<th>Liste des Interventions</th>
</tr>
</thead>
<tbody>
<tr>
{% if voitures.kilometrage-voitures.kilometragederniervidange<20000 and voitures.kilometrage-voitures.kilometragederniervidange>=10000%}
{% for intervention1 in interventions1 %}
<td>{{ voitures.kilometragederniervidange+10000 }}</td>
<td>***{{ intervention1.interventions }}</td>
{% endfor %}{% endif %}
</tr>
</tbody>
</table>
and here's what I get as a result:
and what I want to do is to show each line separately. What should I do exactly? ?
You have probably misplaced the for cycle, try this:
<table class="border" width="100%" align="center">
<thead>
<tr>
<th>Kilometrage</th>
<th>Liste des Interventions</th>
</tr>
</thead>
<tbody>
{% if voitures.kilometrage-voitures.kilometragederniervidange<20000 and voitures.kilometrage-voitures.kilometragederniervidange>=10000%}
{% for intervention1 in interventions1 %}
<tr>
<td>{{ voitures.kilometragederniervidange+10000 }}</td>
<td>***{{ intervention1.interventions }}</td>
</tr>
{% endfor %}
{% endif %}
</tbody>
</table>
This will insert new table row for every record / run of the for cycle.
I have a json document with some data
{"teams":[{"team":"Team A","evolution":[1,2]},{"team":"Team B","evolution":[3,4]}]}
I try to print it to my view with liquid
{% for team in teams %}
<tr>
<td>{{team.team}}</td>
<td>{{team.evolution}}</td>
</tr>
{% endfor%}
The html result is
<tr>
<td>Team A</td>
<td>12</td>
</tr>
<tr>
<td>Team B</td>
<td>34</td>
</tr>
But what I would like to print is the raw array for the second <td>
<tr>
<td>Team A</td>
<td>[1,2]</td>
</tr>
<tr>
<td>Team B</td>
<td>[3,4]</td>
</tr>
Presuming that you get your datas from a _data/teams.json file, this works :
{% assign teams = site.data.teams.teams %}
<table>
{% for team in teams %}
<tr>
<td>{{team.team}}</td>
<td>{{team.evolution | join: "," | prepend: "[" | append: "]"}}</td>
</tr>
{% endfor%}
</table>