Шаблонные операции Django с использованием if, with, for и math-add - PullRequest
Новая
       54

Шаблонные операции Django с использованием if, with, for и math-add

0 голосов
/ 10 октября 2018

Я пытаюсь сформировать таблицу в шаблоне django.Один ряд будет белым, другой - серым ... И так будет продолжаться.Таким образом, в строках таблицы будет отображаться 1 белая строка, 1 серая строка.Так что это будет более читабельным.Я попытался установить целочисленную переменную, чтобы решить, в каком случае условие, какого цвета будет строка.Цвета определяются в классах class = "tr1" и class = "tr2" css.Но это всегда установка class = "tr1".Так что всегда 1-е, если условие работает.Не могу решить. 

{% with 0 as num %}

{% for note in notes %}  

    {% if num == 0 %}
    <tr class="tr1">
      <td class="td_size1">{{note.teacher__name}}</td>
      <td class="td_size1">{{note.attendance}}</td>
      <td class="td_size1">{{note.time}}</td>
      <td class="td_size1">{{note.dailynote}}</td>
    </tr>
    {{ num|add:1 }}
    {% endif %}


    {% if num == 1 %}
    <tr class="tr2">
      <td class="td_size1">{{note.teacher__name}}</td>
      <td class="td_size1">{{note.attendance}}</td>
      <td class="td_size1">{{note.time}}</td>
      <td class="td_size1">{{note.dailynote}}</td>
    </tr>
    {{ num|add:-1 }}
    {% endif %}

{% endfor %}

{% endwith %}

1 Ответ

0 голосов
/ 11 октября 2018

Я решил это с помощью CSS.Существует также решение javascript, но оно не работает, если отключен javascript.В CSS он проверяет, является ли он нечетным или четным.Если он нечетный, он дает первый цвет, если он четный, он дает второй цвет. 

table.custom1 {
    font-family: arial, sans-serif !IMPORTANT;
    border-collapse: collapse !IMPORTANT;
    width: 100% !IMPORTANT;
}

td.custom1, th.custom1 {
    border: 1px solid #511327 !IMPORTANT;
    text-align: left !IMPORTANT;
    padding: 4px !IMPORTANT;
}

tr.custom1:nth-child(even) {
    background-color: #701b36 !IMPORTANT;
}

tr.custom1:nth-child(odd) {
    background-color: #5e172e !IMPORTANT;
...