I have a .yml-file that contains companies. Each company have sub-items, and each sub-item also have tags. It looks like this:
YAML
- name: acme
subfolderitems:
- item: books
item-url: http://acme.com/books
item-tag:
- Nice book
- Cool books
- Wow books
I want to display the company names in a table on each row, together with the tags. Right now I am using this solution:
Code
<table>
{% for company in site.data.companies %}
{% for subfolderitem in company.subfolderitems %}
{% if subfolderitem.item == page.ref %}
<tr>
<td>{{ company.name }}</td>
<td>{% for subfolderitem in company.subfolderitems %}<span class="tag">{{ subfolderitem.item-tag }}</span>{% endfor %}</td>
</tr>
{% endif %}
{% endfor %}
{% endfor %}
</table>
Frontmatter (for books)
---
layout: page
ref: books
title: Books
---
My problem is that the loop for the tags is not working as intended.
Output
<table>
<tbody>
<tr>
<td>acme</td>
<td><span class="tag">Nice bookCool booksWow books</span></td>
</tr>
</tbody>
</table>
Desired output should instead be this <span class="tag">Nice book</span><span class="tag">Cool books</span><span class="tag">Wow books</span>
Any suggestions?
If you use inspect filter :
<span class="tag">{{ subfolderitem.item-tag | inspect }}</span>
You can see that the tags array is printed in one time.
You need to add another loop to print tags one by one.
<table>
{% for company in site.data.companies %}
{% for subfolderitem in company.subfolderitems %}
{% if subfolderitem.item == page.ref %}
<tr>
<td>{{ company.name }}</td>
<td>{% for subfolderitem in company.subfolderitems %}
{% for tag in subfolderitem.item-tag %}
<span class="tag">{{ tag }}</span>
{% endfor %}
{% endfor %}</td>
</tr>
{% endif %}
{% endfor %}
{% endfor %}
</table>
Related
<div class="table-responsive">
<table class="table align-middle table-nowrap table-check table-striped " id="sortMe">
<thead class="table-light">
<tr>
<th city</th>
<th contry</th>
<th>address</th>
</tr>
</thead>
<tbody>
{% for offer in pagination -%}
<tr>
<td>{{ offer.city }}</td>
<td>{{ offer.contry }}</td>
<td>{{ offer.address }} %</td>
{% endif %}
</tr>
{% endfor %}
</tbody>
</table>
</div>
Building a data table with the latest Alpine.js (v3.7.0).
Ran into a problem when trying to implement child rows (i.e an additional togglable row under the main/parent row).
Simplified version:
<tbody>
<template x-for="row in currentPageData" :key="row.id">
<tr>
<td>foo</td>
<td>bar</td>
<td>baz</td>
</tr>
<tr>
<td colspan="3">
Some additional content
</td>
</tr>
</template>
</tbody>
While I'm not getting any errors in the console, the second node (tr) is not rendered. I assume that's because Alpine requires a single root element. Is there any way around it, as wrapping with div is invalid HTML and a tbody wrapper breaks the layout?
Thanks to Alpine templates being rendered server-side I ended up with the following workaround:
When table has child rows I remove the root tbody and wrap each tr pair with a tbody of its own.
EDIT (23-9-22):
As per #NoobnSad's request code in twig:
{% if not options.enableChildRows %}
<tbody>
{% endif %}
<template x-for="row in currentPageData" :key="row.id">
{% if options.enableChildRows %}
<tbody>
{% endif %}
<tr>
{% if options.enableChildRows %}
{% include datatable.componentPath('childRowToggler') %}
{% endif %}
{% include datatable.componentPath('tableCells') %}
</tr>
{% if options.enableChildRows %}
{% include datatable.componentPath('childRow') with {tableHandle:datatable.handle} %}
</tbody>
{% endif %}
</template>
<template x-if="recordsCount===0">
{% include datatable.componentPath('notFound') %}
</template>
{% if not options.enableChildRows %}
</tbody>
{% endif %}
This question already has an answer here:
Reference template variable within Jinja expression
(1 answer)
Closed 2 years ago.
I'm writing a little programm in Python, Flask which schould write all whatsapp message informations (using Twilio) in an SQLite Data Base. The storing of the other informations is working fine (ID, Rufnummer, Text, Datum). For the sent images I'm storing the path in the database an the images in static/Images.
<table>
<tr>
<th>ID</th>
<th>Rufnummer</th>
<th>Screenshot</th>
<th>Text</th>
<th>Datum</th>
</tr>
{% for task in tasks %}
<tr>
<td>{{ task.id }}</td>
<td>{{ task.Rufnummer }}</td>
<td>{{ task.Screenshot }}<img src="{{ url_for("static", filename="/Images/{{ task.Screenshot }}") }}" width="30" height="40"/></td>
<td>{{ task.Text }}</td>
<td>{{ task.Datum.date() }}</td>
<td>
Löschen
</td>
</tr>
{% endfor %}
</table>
Most of my programm is from tutorials and copied together! :'D
I think that this part is not right: filename="/Images/{{ task.Screenshot }}"
webapplication of the database
Thank you for your Help!
Best regards,
Mathias
Just use string concatination. Something like:
{{ url_for("static", filename="Images/" + task.Screenshot) }}
I have a view that displays a set of data of about 3000+ records (multiple objects combined into a QuerySet. The result is rendered into a table using DataTables but the render time is terrible - 15 seconds at least.
I dug deeper into DataTables and found deferRender API option together with AJAX thing. As I never used it before I'd like to ask for guidance on how to approach in my particular case. Below are views.py and template with DataTables.
views.py:
def index(request):
clients = Client.objects.all().prefetch_related('loan_set', 'loan_set__case_set')
return render(request, 'app/index.html',
{'clients': clients})
index.html:
<table id="case_list" class="display">
<thead>
<tr>
<td>Imię i nazwisko</td>
<td>Edycja</td>
</tr>
</thead>
<tbody>
{% for c in clients %}
<tr>
<td>{{ c.firstName }} {{ c.lastName }}</td>
{% if c.editLock %}
<td><i class="fas fa-lock fa-lg" style="color:Red" title="W edycji przez: {{ c.lockedBy }}"></i> {{ c.lockedBy }}</td>
{% else %}
<form method="post">
{% csrf_token %}
<td><i class="fas fa-pen-square fa-2x" style="color:green"></i></td>
</form>
{% endif %}
</tr>
{% endfor %}
</tbody>
</table>
<script type="text/javascript">
$(document).ready(function(){
$('#case_list').DataTable( {
deferRender: true
}
);
});
</script>
Look at the documentation for datatables.
$('#case_list').DataTable( {
"processing": true,
"serverSide": true,
"ajax": "{yourdata_url}"
} );
In your view, you have to send the data in json format. Note that you need to do the search etc with your logic in the view.
I would also look into django-datatable-view package.
I'm trying to get the fieldname of a pagerfanta results.
Twig template
{% for post in posts %}
{{ dump(post) }}
{% endfor %}
The dump result is:
Users {#764 ▼
-iduser: 11
-username: "xzvdsfg"
-password: "SHHHHHH"
-lastlogin: DateTime {#691 ▶}
-roles: []
}
i want to get the name of each entry without known it to place in a table like this
<table>
<thead>
<th>{{ fieldname }}</th>
</thead>
<tbody>
<td>{{ fieldname.value }}</td>
</tbody>
</table>
and get this result
<table>
<thead>
<th>username</th>
</thead>
<tbody>
<td>xzvdsfg</td>
</tbody>
</table>
I'm new at Twig templates
Thanks!!!!
You could cast the object to array and iterate over then. You have to create your own twig filter to casting your object to array.
{% for key, value in post|cast_to_array %}
{% endfor %}