For Loop HTML Django

Question

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

If you are intending multiple table rows, should the <tr> and </tr> be inside the {% for ...} loop? Otherwise, you need to clarify the question. Also suggest browser "view page source" to see what html actually got generated. Generating some  will help with debugging. — nigel222
– nigel222, Commented Feb 5, 2020 at 16:36

dirkgroten · Accepted Answer · 2020-02-05 16:46:30Z

1

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>).

answered Feb 5, 2020 at 16:46

dirkgroten

20.8k2 gold badges32 silver badges46 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

GammaGames · Accepted Answer · 2020-02-05 16:39:32Z

0

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>

answered Feb 5, 2020 at 16:39

GammaGames

1,9742 gold badges27 silver badges42 bronze badges

Collectives™ on Stack Overflow

For Loop HTML Django

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related