Modify Django for loop every four iterations

Question

I have a calendar generated by Django and styled with Bootstrap. Here is the code in the Django template :

<div class="content">
  {% for month in period.get_months %}
    <div class="col-md-3">
      <div class="row row-centered">
        <button class="btn btn-custom active" href="{% url "month_calendar" calendar.slug %}{% querystring_for_date month.start 2 %}">{{month.name}}</button>
      </div>
      <div>
        {% month_table calendar month "small" %}
      </div>
    </div>
  {% endfor %}
</div>

Now, since months have a different number of weeks they have different heights I would like to avoid something like this:

I understand from this answer that the best solution would be to use a clearfix.

So, how can I modify the for loop in my template so that Django inserts an extra line <div class="clearfix"></div> every four items?

Have you seen the [`divisibleby`](https://docs.djangoproject.com/en/1.10/ref/templates/builtins/#divisibleby) filter? — Jens Astrup, Jun 04 '17 at 20:28

Dima Kudosh · Accepted Answer · 2017-06-04T21:09:04.240

4

Django templates for loop store current index in forloop.counter variable. You can read about this in docs. So you can try to change you code like this:

<div class="content">
  {% for month in period.get_months %}
    <div class="col-md-3">
      <div class="row row-centered">
        <button class="btn btn-custom active" href="{% url "month_calendar" calendar.slug %}{% querystring_for_date month.start 2 %}">{{month.name}}</button>
      </div>
      <div>
        {% month_table calendar month "small" %}
      </div>
    </div>
    {% if forloop.counter|divisibleby:4 %}
        <div class="clearfix"></div>
    {% endif %}
  {% endfor %}
</div>

edited Jun 04 '17 at 21:09

answered Jun 04 '17 at 20:27

Dima Kudosh

7,126
4
36
46

HI. I'm not at all familiar with the % notation Django. I tried your code which makes sense but I get an error `Could not parse the remainder: '%' from '%'` – user2314737 Jun 04 '17 at 20:52
Hi, I fixed my answer, try it now – Dima Kudosh Jun 04 '17 at 20:55
Now I'm getting the error message `'endfor', expected 'elif', 'else' or 'endif'. Did you forget to register or load this tag?` – user2314737 Jun 04 '17 at 21:00
Sorry it's typo I closed if block using endfor block instead of endif. – Dima Kudosh Jun 04 '17 at 21:02
Ok, got it and it works! (except maybe one should skip the 0 counter because right now the month of january is in its own row) – user2314737 Jun 04 '17 at 21:02

Modify Django for loop every four iterations

1 Answers1