html - Django dynamically display a list but ignore some items

Question

I am trying to show a list of groups on the sidebar on my html using Django. The first item will always be "all". so when I tranverse through all the groups/subreddits, I would first display "all" and then display the rest. however, when I display the rest and when it hits "all" again, instead of doing nothing, it seems to be printing a empty line because later when I display it in forms, I notice that I have a blank cell. I wonder how do I make sure that it just ignores "all" and goes on to display the next group without the empty space. Here is the code:

    <div class="post" id="title"><h4>Groups </h4></div>

    {% for sub in subreddits %}

        {% if sub.name == 'all' %}
            <div class="post"> <a href="{% url 'sub_detail' pk=sub.pk %}">{{ sub.name }}</a></div>
        {% endif %}

    {% endfor %}


    {% for sub in subreddits %}
        <div class="post">
            {% if sub.name != 'all' %}
                <a href="{% url 'sub_detail' pk=sub.pk %}">{{ sub.name }}</a>
            {% endif %}
        </div>
    {% endfor %}

question from:https://stackoverflow.com/questions/65946846/django-dynamically-display-a-list-but-ignore-some-items

Answer 1

The problem

Think about what will get rendered when sub.name == 'all' - the <div> is currently outside the if tag, so was getting displayed regardless. You'll get this:

<div class="post">

</div>

This is probably why you're getting an extra line.

The solution

Move the <div> inside your if tag:

    {% for sub in subreddits %}
        {% if sub.name != 'all' %}
            <div class="post">
                <a href="{% url 'sub_detail' pk=sub.pk %}">{{ sub.name }}</a> 
            </div>
        {% endif %}
    {% endfor %}

This way when sub.name == 'all', nothing is rendered at all.