用于填充引导行和列的django模板

时间:2013-12-01 06:57:13

标签: django templates twitter-bootstrap tags

所以这是我的问题:我有一堆类的实例。我想有一个这些实例对象的表,所以每行最多有六个。在bootstrap术语中,我希望每个对象由类“span2”的“div”中的缩略图表示。

我最初的冲动是使用嵌套的for循环,但是我在模板中操作索引变量时遇到了麻烦,而且我无法弄清楚如何在模板之外这样做。

这里通常是python / django模板/伪代码我想弄清楚的。

queryset = Class.objects.all()
set_length = queryset.count()

num_rows = set_length/6 
#because I want 6 columns in each row, each with one instance

set_as_list = list(queryset) 
# have a list so I can iterate through objects by index

for i in range(table_rows):
    # make a row
    <div class="row">
    for j in range (i*6,(i+1)*6):
        #make six or less columns
        <div class="span2">
           <p>set_as_list[j].attribute1</p>
           <p>set_as_list[j].attribute2</p>
        </div>
    </div> # end row

我希望django模板语言,python和html的公然混合不会冒犯任何人。只是想表达我想要做的事情的想法。我很感激有人愿意提供任何帮助,因为我已经在这方面苦苦挣扎了好几天,并且在模板和外部都做了很多寻求解决方案。

我也意识到在整数除法之后需要最后一行包含剩余的对象。

5 个答案:

答案 0 :(得分:41)

没有时间解释,但我遇到了类似的问题,直到我关闭此浏览器页面这里是一个解决方案

{% for sub_article in articles %}
    {% if forloop.first %}<div class="row">{% endif %}
    <div class="col-xs-4">
            <a href="#">
                {{ sub_article.name }}
            </a>
        </div>
    {% if forloop.counter|divisibleby:3 %}</div><div class="row">{% endif %}
    {% if forloop.last %}</div>{% endif %}
{% endfor %}

答案 1 :(得分:3)

由于forloop.counter以1开始索引,因此divisibleby 3不起作用。 所以请改用forloop.counter0。

<div class="row">
{% for product in all_products %}
    {% if forloop.counter0|divisibleby:3 %}
        </div><br><div class="row">
    {% endif %}
        <div class="col-4"></div>
{% endfor %}

答案 2 :(得分:1)

您可以使代码更通用。这是逻辑:

queryset = Class.objects.all()
set_length = queryset.count()

<div class="row">
{% for i in queryset %}
    <div class="span2">
        <p>i.attr</p>
        <p>i.attr</p>
    </div>
    {% if forloop.counter|divisibleby:"6" or forloop.last %}
        </div> <!--end row-->
    {% endif %}
{% endfor %}

我希望这可以解决你的问题: - )

答案 3 :(得分:0)

可能为时已晚,但有simple solution如下

<div class="container">
    <div class="row">
        {% for product in products %}
            {% if forloop.counter0|divisibleby:3 and not forloop.first %}<div class="w-100"></div>{% endif %}
            <div class="col">{{product.title}}</div>
        {% endfor %}
    </div>
</div>

答案 4 :(得分:0)

我建议添加自定义标签as_chunk。我认为这使代码更漂亮,更易读。

# app/templatetags/my_tags.py

from math import ceil
from django import template

register = template.Library()

@register.filter
def as_chunks(lst, chunk_size):
    limit = ceil(len(lst) / chunk_size)
    for idx in range(limit):
        yield lst[chunk_size * idx : chunk_size * (idx + 1)]


# app/templates/your-template.html

{% load my_tags %}

...

{% for chunk in elements|as_chunk:6 %}
  <div class="row">
    {% for element in chunk %}
      <div class="col-2">
        {{ element.name }}
      </div>
    {% endfor %}
  </div>
{% endfor %}

...