how to loop through a condition in Django template - django

Question

I'm attempting to display "you don't have active investment" just when there are no investments, however I've discovered that whenever the loop runs, it displays the same message multiple times when there is no investment.
I believe I have given enough information to anyone who is willing to give it a trial.
The code snippet is below, along with a screenshot at the bottom.
<h1 class="md:ml-[11.5em] mt-7 mb-0 font-bold"> Active Plan</h1>
{% for investment in investments %}
{% if investment.is_active == True %}
<div class="row justify-center my-5 md:my-3">
<div class="col-md-9 border-2 border-gray-300 rounded-lg">
<div class="pricing-table-item bg-athens-gray px-4 md:py-0">
<div class="space-y-10 md:flex justify-between items-end">
<div>
<h1 class="font-bold capitalize" style="font-family: Open Sans;">{{investment.plan}}</h1>
<div class="text-sm my-2" style="font-family: Open Sans;"><span class="text-gray-400">Invested Amount -</span> <span class="font-bold">{{investment.deposit_amount}} USD</span></div>
</div>
<div class="flex justify-between align-items-center">
<div>
<h1 class="font-bold capitalize" style="font-family: Open Sans;">{{investment.created_at}}</h1>
<div class="text-sm my-2 text-gray-400" style="font-family: Open Sans;">Start Date</div>
</div>
<div class="ml-3 mr-3">
<i class="fa-solid fa-arrow-right-long text-gray-400"></i>
</div>
<div>
{% if investment.plan == "Basic - Daily 2% for 180 Days" %}
<h1 class="font-bold capitalize" style="font-family: Open Sans;">{{investment.due_date}}</h1>
{% else %}
<h1 class="font-bold capitalize" style="font-family: Open Sans;">{{investment.due_date}}</h1>
{% endif %}
<div class="text-sm my-2 text-gray-400" style="font-family: Open Sans;">End Date</div>
</div>
</div>
<div class="md:flex justify-center items-center">
<div>
{% if investment.plan == "Basic - Daily 2% for 180 Days" %}
<h1 class="font-bold" style="font-family: Open Sans;">${{investment.investment_return}}</h1>
{% else %}
<h1 class="font-bold" style="font-family: Open Sans;">$ {{investment.investment_return}}</h1>
{% endif %}
<div class="text-sm my-2 text-gray-400" style="font-family: Open Sans;">Total Return</div>
</div>
</div>
<div>
{% if investment.plan == "Basic - Daily 2% for 180 Days" %}
<h1 class="font-bold" style="font-family: Open Sans;">$ {{investment.basic_interest}}</h1>
{% else %}
<h1 class="font-bold" style="font-family: Open Sans;">$ {{investment.premium_interest}}</h1>
{% endif %}
<div class="text-sm my-2 text-gray-400" style="font-family: Open Sans;">Net Profit Earn</div>
</div>
</div>
</div>
</div>
</div>
{% else %}
<p>You dont have active Investment</p>
{% endif %}
{% endfor %}
<h1 class="md:ml-[11.5em] mt-7 mb-0 font-bold"> Recently Ended</h1>
{% for investment in investments %}
{% if investment.is_active == False %}
<div class="">
<div class="row justify-center my-5 md:my-3">
<div class="col-md-9 border-2 border-gray-300 rounded-lg">
<div class="pricing-table-item bg-athens-gray px-4 md:py-0">
<div class="space-y-10 md:flex justify-between items-end">
<div>
<h1 class="font-bold capitalize" style="font-family: Open Sans;">{{investment.plan}}</h1>
<div class="text-sm my-2" style="font-family: Open Sans;"><span class="text-gray-400">Invested Amount -</span> <span class="font-bold">{{investment.deposit_amount}} USD</span></div>
</div>
<div class="flex justify-between align-items-center">
<div>
<h1 class="font-bold capitalize" style="font-family: Open Sans;">{{investment.created_at}}</h1>
<div class="text-sm my-2 text-gray-400" style="font-family: Open Sans;">Start Date</div>
</div>
<div class="ml-3 mr-3">
<i class="fa-solid fa-arrow-right-long text-gray-400"></i>
</div>
<div>
{% if investment.plan == "Basic - Daily 2% for 180 Days" %}
<h1 class="font-bold capitalize" style="font-family: Open Sans;">{{investment.due_date}}</h1>
{% else %}
<h1 class="font-bold capitalize" style="font-family: Open Sans;">{{investment.due_date}}</h1>
{% endif %}
<div class="text-sm my-2 text-gray-400" style="font-family: Open Sans;">End Date</div>
</div>
</div>
<div class="md:flex justify-center items-center">
<div>
{% if investment.plan == "Basic - Daily 2% for 180 Days" %}
<h1 class="font-bold" style="font-family: Open Sans;">${{investment.investment_return}}</h1>
{% else %}
<h1 class="font-bold" style="font-family: Open Sans;">$ {{investment.investment_return}}</h1>
{% endif %}
<div class="text-sm my-2 text-gray-400" style="font-family: Open Sans;">Total Return</div>
</div>
</div>
<div>
{% if investment.plan == "Basic - Daily 2% for 180 Days" %}
<h1 class="font-bold" style="font-family: Open Sans;">$ {{investment.basic_interest}}</h1>
{% else %}
<h1 class="font-bold" style="font-family: Open Sans;">$ {{investment.premium_interest}}</h1>
{% endif %}
<div class="text-sm my-2 text-gray-400" style="font-family: Open Sans;">Net Profit Earn</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% else %}
<p>You dont have active Investment</p>
{% endif %}
{% endfor %}

Answer 1

Something like this ?
in your views.py:
[...]
atleast_one_active=False
atleast_one_inactive=False
for investment in investments:
if investment.is_active:
atleast_one_active=True
else:
atleast_one_inactive=True
context[
...
"atleast_one_inactive":atleast_one_inactive,
"atleast_one_active":atleast_one_active,
]
return render(...)
In your HTML:
<h1 class="md:ml-[11.5em] mt-7 mb-0 font-bold"> Active Plan</h1>
{% if atleast_one_active %}
{% for investment in investments %}
{% if investment.is_active == True %}
<div class="row justify-center my-5 md:my-3">
[ ... ]
</div>
{% endif %}
{% endfor %}
{% else %}
<p>You dont have active Investment</p>
{% endif %}
<h1 class="md:ml-[11.5em] mt-7 mb-0 font-bold"> Recently Ended</h1>
{% if atleast_one_inactive %}
{% for investment in investments %}
{% if investment.is_active == False %}
<div class="">
[ ... ]
</div>
{% endif %}
{% endfor %}
{% else %}
<p>You dont have active Investment</p>
{% endif %}