Okay, I'll try to make it short.
I got an XML file from Musicbrainz. Then I converted it to CSV and replaced the .'s with _'s to make it work with Liquid.
I put music.csv in _data and call it with:
{% include music.html %}
_includes/music.html looks (in part) like:
<table border="1" style="width:100%">
<tr>
<td>Artist</td>
<td>Track title</td>
</tr>
<tr>
{% if member.release_medium-list_medium_track-list_track_0_recording_artist-credit_name-credit_artist_name %}
<td>{{ member.release_medium-list_medium_track-list_track_0_recording_artist-credit_name-credit_artist_name }}</td>
{% endif %}
{% if member.release_medium-list_medium_track-list_track_0_recording_title %}
<td>{{ member.release_medium-list_medium_track-list_track_0_recording_title }}</td>
{% endif %}
</tr>
<tr>
{% if member.release_medium-list_medium_track-list_track_1_recording_artist-credit_name-credit_artist_name %}
<td>{{ member.release_medium-list_medium_track-list_track_1_recording_artist-credit_name-credit_artist_name }}</td>
{% endif %}
{% if member.release_medium-list_medium_track-list_track_1_recording_title %}
<td>{{ member.release_medium-list_medium_track-list_track_1_recording_title }}</td>
{% endif %}
</tr>
<tr>
{% if member.release_medium-list_medium_track-list_track_2_recording_artist-credit_name-credit_artist_name %}
<td>{{ member.release_medium-list_medium_track-list_track_2_recording_artist-credit_name-credit_artist_name }}</td>
{% endif %}
{% if member.release_medium-list_medium_track-list_track_2_recording_title %}
<td>{{ member.release_medium-list_medium_track-list_track_2_recording_title }}</td>
{% endif %}
</tr>
Now, clearly, this is not the best way to do it. What I'm after is something that:
Looks for the relevant data
If the data is there, creates the cells and fills them out.
I'm pretty sure this can be done with Liquid, but I have no idea how. Can someone here help?
EDIT: Turns out I forgot the CSV file -- here it is, on Pastebin.
EDIT 2: This Cheat Sheet might be of help!
The format of a CSV file inherently does not support repeated sections so I think it would be a bad fit for the variable length data format you are trying to use. I feel JSON is more appropriate for this use case as it can handle the structure of the source data you are trying to work with.
As a quick example I put the XML file you supplied through this converter to create a JSON version of the output. This was saved as "_data/music.json".
This liquid code was then used to parse this:
{% for item in site.data.music %}
<h2> {{ item[1].release.title }}</h2>
{% for medium in item[1].release.medium-list %}
<h3> {{ medium[1].format }} </h3>
<table border="1" style="width:100%">
<tr>
<td>Artist</td>
<td>Track title</td>
</tr>
{% for track in medium[1].track-list.track %}
<tr>
<td>{{ track.recording.artist-credit.name-credit.artist.name }}</td>
<td>{{ track.recording.title }}</td>
</tr>
{% endfor %}
</table>
{% endfor %}
{% endfor %}
This produces HTML like this (trimmed):
<h2> The Quatermass Film Music Collection</h2>
<h3> CD </h3>
<table border="1" style="width:100%">
<tr>
<td>Artist</td>
<td>Track title</td>
</tr>
<tr>
<td>Tristram Cary</td>
<td>Quatermass and the Pit: Opening Credits</td>
</tr>
<tr>
<td>Tristram Cary</td>
<td>Quatermass and the Pit: Bones</td>
</tr>
</table>
Based on this you should be able to produce the format you ultimately want.
This is a simple way to iterate over a csv file.
<div class="table-responsive">
<table class="table">
<thead>
<tr>
{% for column in include.datafile[0] %}
<th>{{ column[0] }}</th>
{% endfor %}
</tr>
</thead>
<tbody>
{% for spec in include.datafile %}
<tr>
{% for value in spec %}
<td>{{ value[1] }}</td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
</div>
Related
I'm trying to display me df in a table to my web app (without using .tohtml because I need a dynamic table).
It seems that I can't use the key/column variable from my loop :
<table id='bdd_table'>
<thead>
<tr>
{% for header in BDD_Data %}
<th> {{header}} </th>
{% endfor %}
</tr>
</thead>
<tbody>
{% for key in BDD_Data_size %}
<tr>
{% for column in BDD_Data %}
<td> {{BDD_Data[column][key]}} </td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
My error:
I think I've any problems with my data because if I write {{column}} / {{key}} instead of {{BDD_Data[column][key]}} it displays all the values from my dataframe.
The trick was to use mydataframe.values :
<table id='bdd_table'>
<thead>
<tr>
{% for header in BDD_Data %}
<th> {{header}} </th>
{% endfor %}
</tr>
</thead>
<tbody>
{% for value in BDD_Data.values %}
<tr>
{% for cell in value %}
<td> {{cell}} </td>
{% endfor %}
</tr>
{% endfor %}
</tbody>
</table>
I am trying to create a table with HTML tags but I am stuck with it.
I've tried to play with {% for i in list %}, but I couldn't find a solution.
list = {'ticker': tickers, 'price': prices}
<tbody>
<tr>
{% for i in price %}
<td>{{ i }}</td>
{% endfor %}
{% for i in ticker %}
<td>{{ i }}</td>
{% endfor %}
</tr>
<tr>
</tr>
</tbody>
I would see two columns one close to another, but I don't see any columns now.
try this
<tbody>
{% for i in list %}
<tr>
<td>{{ i.ticker }}</td>
<td>{{ i.price }}</td>
</tr>
{% endfor %}
</tbody>
for more details refer this
hope it helps
I have a list of list like :
[[elem0, elem1, elem2], [elem3, elem4, elem5], [elem6, elem7, elem8], ...]
I wrote the follow template file :
{% for result in results %}
<tr>
<td>result[0]</td>
<td>result[1]</td>
<td>result[2]</td>
</tr>
{% endfor %}
But it didn't work, What i can think is use nested for. Is there another method to access the element in the list in jinja?
You still need to output the loop variables inside braces.
{% for result in results %}
<tr>
<td>{{ result[0] }}</td>
<td>{{ result[1] }}</td>
<td>{{ result[2] }}</td>
</tr>
{% endfor %}
Also, consider a nested for loop:
{% for result in results %}
<tr>
{% for elem in result %}
<td>{{elem}}</td>
{% endfor %}
</tr>
{% endfor %}
I am not very good with table in html, so this question might be very simple to answer.
I pass the list of list {{ attributes }} to the template and I want to create a table with 2 rows and many columns.
TEMPLATE:
<div id="table">
<table border=0>
{% for attr in attributes %}
<td>
<th>{{ attr.0 }}</th>
{{ attr.1 }}
</td>
{% endfor %}
</table>
</div>
I want the {{ attr.0 }} to be the header and displayed on a single row and the {{ attr.1 }} displayed on the second row.
How about
<div id="table">
<table border=0>
<thead>
<tr>
{% for attr_head in attributes.keys %}
<th>{{ attr_head }}</th>
{% endfor %}
</tr>
</thead>
<tbody>
<tr>
{% for attr in attributes.values %}
<td>{{ attr }}</td>
{% endfor %}
</tr>
</tbody>
</table>
</div>
Just loop through the dict's keys and rendering them as th elements in the table header and then loop through the values, rendering them inside the tbody. th and td are columns in the table and tr are rows.
Also, you should read up on html tables, they aren't that hard
You could just loop twice, once for headers once for content?
<div id="table">
<table border=0>
<tr>
{% for attr in attributes %}
<th>{{ attr.0 }}</th>
{% endfor %}
</tr>
<tr>
{% for attr in attributes %}
<td>{{ attr.1 }}</td>
{% endfor %}
</tr>
</table>
</div>
I'm creating an e-commerce website and I wanted to build a page where I could view a list of all the orders created.
If the order contains just 1 type of item, the format works correctly, but i can't think of a way to construct the table when there are multiple types of items ordered.
This is how it looks like when there are 2 items ordered (last entry):
I want the "Queso Burrito" to be right under "steak and egg burrito" for #18.
This is my code:
<table>
<tr>
<td>#</td>
<td>Name</td>
<td>Email</td>
<td>Phone</td>
<td>Order</td>
<td>Order Quantity</td>
<td>Delivered</td>
</tr>
{% for ord in orders %}
<tr>
<td>{{ord.pk}}</td>
<td>{{ord.user.first_name}}</td>
<td>{{ord.user.email}}</td>
<td>{{ord.user.get_profile.phone}}</td>
{% for food in ord.orderitem_set.all %}
<td>{{food.name}}</td>
<td>{{food.quantity}}</td>
{% endfor %}
<td>x</td>
</tr>
{% endfor %}
</table>
With multiple items, you typically see tables with order data repeated for each line item.
{% for order in orders %}
{% for orderitem in order.items %}
<td>{{order.id}}</td><td>...</td>
{% endfor %}
{% endfor %}
If you want exactly the formatting you described, you could check if the inner loop is past its first item and hide the fields you don't want repeated.
<table>
{% for ord in orders %}
{% for item in ord.orderitem_set.all %}
<tr>
{% if forloop.counter == 1 %}
<td>{{ord.pk}}</td>
<td>{{ord.user.first_name}}</td>
<td>{{ord.user.email}}</td>
<td>{{ord.user.get_profile.phone}}</td>
{% else %}
<td colspan="4"></td>
{% endif %}
<td>{{item.name}}</td>
<td>{{item.quantity}}</td>
<td>{% if forloop.counter == 1 %}x{% endif %}</td>
</tr>
{% endfor %}
{% endfor %}
</table>