Skip to content

Instantly share code, notes, and snippets.

@dyve
Created April 25, 2013 08:00
Show Gist options
  • Star 8 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save dyve/5458209 to your computer and use it in GitHub Desktop.
Save dyve/5458209 to your computer and use it in GitHub Desktop.
Bootstrap template for django-tables2 (https://github.com/bradleyayers/django-tables2), currently depends on django-bootstrap-toolkit (https://github.com/dyve/django-bootstrap-toolkit)
.table-container th.asc:after {
content: '\0000a0\0025b2';
}
.table-container th.desc:after {
content: '\0000a0\0025bc';
}
.pagination {
text-align: center;
}
{% load querystring from django_tables2 %}
{% load trans blocktrans from i18n %}
{% load bootstrap_toolkit %}
{% if table.page %}
<div class="table-container">
{% endif %}
{% block table %}
<table class="table table-compact table-bordered"{% if table.attrs %} {{ table.attrs.as_html }}{% endif %}>
{% block table.thead %}
<thead>
<tr>
{% for column in table.columns %}
{% if column.orderable %}
<th {{ column.attrs.th.as_html }}><a href="{% querystring table.prefixed_order_by_field=column.order_by_alias.next %}">{{ column.header }}</a></th>
{% else %}
<th {{ column.attrs.th.as_html }}>{{ column.header }}</th>
{% endif %}
{% endfor %}
</tr>
</thead>
{% endblock table.thead %}
{% block table.tbody %}
<tbody>
{% for row in table.page.object_list|default:table.rows %} {# support pagination #}
{% block table.tbody.row %}
<tr class="{% cycle "odd" "even" %}">
{% for column, cell in row.items %}
<td {{ column.attrs.td.as_html }}>{{ cell }}</td>
{% endfor %}
</tr>
{% endblock table.tbody.row %}
{% empty %}
{% if table.empty_text %}
{% block table.tbody.empty_text %}
<tr><td colspan="{{ table.columns|length }}">{{ table.empty_text }}</td></tr>
{% endblock table.tbody.empty_text %}
{% endif %}
{% endfor %}
</tbody>
{% endblock table.tbody %}
{% block table.tfoot %}
<tfoot></tfoot>
{% endblock table.tfoot %}
</table>
{% endblock table %}
{% if table.page %}
{% block pagination %}
{{ table.page|pagination }}
{% endblock pagination %}
{% endif %}
@magatz
Copy link

magatz commented Dec 28, 2013

Thanks a lot!
Just a question about the css, when and where is used?
TIA

@SonOfLilit
Copy link

Thanks a lot. I adapted it to your bootstrap3:

https://gist.github.com/SonOfLilit/9600295

@stumc
Copy link

stumc commented Apr 2, 2014

This is excellent - but I noticed one issue - there is a close-div missing to balance out the <div> of the table-container. (I noticed this by the presence of a Firefox -> Show Source error highlight.) This appears to be an issue in the template code above - a closing match for

is missing. I added it in my local copy at the end of the template like this:

{% if table.page %}
</div>
{% endif %}

@Prav001
Copy link

Prav001 commented Nov 21, 2014

Getting one error when using table.html .It says:
"Error during template rendering
In template C:\Python34\lib\site-packages\django_tables2\templates\django_tables2\table.html, error at line 51
unorderable types: NoneType() > int()"

Any advice, me being python and Django noob any help is appreciated .

@lgaticaq
Copy link

lgaticaq commented Jul 3, 2015

Fix sorting adding this code:

{% if table.page %}
  {% block pagination %}
    {% bootstrap_pagination table.page url=request.get_full_path %}
  {% endblock pagination %}
  </div>
{% endif %}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment