CODEWITHSUNDEEP
htmldjango
Ray Zuchowski
Ray Zuchowski

Reputation: 383

For Loop HTML Django

I have a for loop within my Django project, what I'am trying to do is the following :

If
morning_recess == True
lunch_recess == True
afternoon_recess == True

then the bootstrap tag in that field should be
<td><span class="badge badge-success">Success</span></td>
else
<td> None </td>

Here is my current code:

<table style="width:100%">
  <tr>
    <th>Student Name</th>
    <th>Morning Recess</th>
    <th>Lunch Recess</th>
    <th>Afternoon Recess</th>
    <th>Earned At</th>

  </tr>

  <tr>
     {% for i in students_recess_today %}
     {% if i.morning_recess == True %}
     <td>{{i.student_ps }}</td>
     <td><span class="badge badge-success">Success</span></td>
     <td>{{i.lunch_recess}}</td>
     <td>{{i.afternoon_recess}}</td>
     <td>{{i.created_at}}</td>
     {% else %}
     <td>{{i.student_ps }}</td>
     <td>None</td> 
     <td>{{i.lunch_recess}}</td>
     <td>{{i.afternoon_recess}}</td>
     <td>{{i.created_at}}</td>
     {% endif %}
  </tr>

{% endfor %}
</table>
</div>

The morning_recess works fine, however if i do another if statement after the following one, the order of my table gets all messed up. How do I write this correctly? Thank you

Upvotes: 0

Views: 231

Answers (2)

dirkgroten
dirkgroten

Reputation: 20672

It's not clear what "in that field" means, because in your example you have one extra column before the morning_recess column. But you can put {% if %} statements anywhere you want in the template, e.g.:

<td>
  {% if i.morning_recess %}
    <span class="badge badge-success">Success</span> 
  {% else %}
    <span>None</span>
  {% endif %}
</td>
<td>
  {% if i.lunch_recess %}
    <span class="badge badge-success">Success</span> 
  {% else %}
    <span>None</span>
  {% endif %}
</td>
<td>
  {% if i.afternoon_recess %}
    <span class="badge badge-success">Success</span> 
  {% else %}
    <span>None</span>
  {% endif %}
</td>
...

Also as other commenters suggest, your for loop should probably wrap the rows of your table (<tr>...</tr>), not the columns (<td>).

Upvotes: 1

GammaGames
GammaGames

Reputation: 1820

You have the loop partially inside your tr element. It starts a row at the beginning and for every student adds the columns and ends a row, so it ends up looking like <tr></tr></tr></tr>.

You should move your for statement outside of the row, like so:

...

{% for i in students_recess_today %}
  <tr>
    ...
  </tr>
{% endfor %}
</table>
</div>

Upvotes: 0

Related Questions