am new to Python and Django.
I have a problem. i want to increment the value of current inside the for loop and check if the value is equal to 1 and if not i want to display some HTML tags.
here is my code.
{% with current=1 %}
{% for howitwork in howitworks%}
{% if current != 1 %}
<div class=item>
<div class=container-fluid>
<div class=row>
<div class="col-md-5 rex-block">
<img src="media/{{ howitwork.image }}" alt>
</div>
<div class="col-md-7 rx-services-box">
<div class=rx-conta-title>
<h3>{{ howitwork.subtitle }}</h3>
</div>
<p>{{ howitwork.description|linebreaks }}</p>
</div>
</div>
</div>
</div>
{% endif %}
{% endfor %}
{% endwith %}
I don't see any errors but its not working.
If you need to skip the logic on first loop iteration just use forloop.first field. It is accessible inside forloop block.
{% for howitwork in howitworks %}
{% if not forloop.first %}
<!-- do stuff -->
{% endfor %}
Use forloop.counter (forloop.counter0 for 0-indexed) instead of current variable.
Here is the possible solution for your snippet:
{% for howitwork in howitworks%}
{{forloop.counter}}
{% if forloop.counter != 1 %}
<div class=item>
<div class=container-fluid>
<div class=row>
<div class="col-md-5 rex-block">
<img src="media/{{ howitwork.image }}" alt>
</div>
<div class="col-md-7 rx-services-box">
<div class=rx-conta-title>
<h3>{{ howitwork.subtitle }}</h3>
</div>
<p>{{ howitwork.description|linebreaks }}</p>
</div>
</div>
</div>
</div>
{% endif %}
{% endfor %}
To check the current iteration count, you can use {{forloop.counter}}
So your condition could be like this
{% if forloop.counter == 1 %}
<!-- Do things -->
{% else %}
<!-- Do some other things -->
{% endif %}
Related
Currently trying to iterate over a list using Django templating.
What I am trying to achieve is having multiple row with three columns. The current logic creates a one row with around every third card element.
What would be the best approach for creating each row w/ three columns?
{% extends "stockwatcher/base.html" %}
{% block content %}
<div class="container">
{% for stock in stocks %}
{% if forloop.counter0 == 0 or forloop.counter0|divisibleby:3 %}
<div class="row">
{% endif %}
<div class="col-sm">
<div class="card text-white bg-info mb-3" style="max-width: 18rem;">
<div class="card-header">{{stock.transaction_date}}</div>
<div class="card-body">
<h5 class="card-title">{{ stock.id }} {{stock.ticker}} </h5>
<p class="card-text">{{stock.senator}} - {{stock.type}}</p>
</div>
</div>
</div>
{% if forloop.counter0 == 0 or forloop.counter0|divisibleby:3 %}
</div>
{% endif %}
{% endfor %}
</div>
{% endblock content %}
You should use row div outside the for loop and bootstrap classes will handle the rest for you. You can also use {% empty %} tag to handle empty list.
{% extends "stockwatcher/base.html" %}
{% block content %}
<div class="container">
<div class="row">
{% for stock in stocks %}
<div class="col-sm">
<div class="card text-white bg-info mb-3" style="max-width: 18rem;">
<div class="card-header">{{stock.transaction_date}}</div>
<div class="card-body">
<h5 class="card-title">{{ stock.id }} {{stock.ticker}} </h5>
<p class="card-text">{{stock.senator}} - {{stock.type}}</p>
</div>
</div>
</div>
{% empty %}
No items
{% endfor %}
</div>
</div>
{% endblock content %}
I have the following code in one of my templates. As you can see, there is a lot of repetition going on. Hence, I am wondering if I can somehow use Django Template to consolidate this code while achieving the same (or closely comparable) result when it comes to HTML. Namely, I am interested if I can sort the todo entries into two different <ul> tags on the page, depending on the boolean value of todo.todo_completed.
{% block content %}
{% if todo_list %}
<ul class="list-group">
{% for todo in todo_list %}
{% if not todo.todo_completed %}
<li class="list-group-item">
<div class="row">
<div class="col-sm-5">
<a href="{% url 'list:todo-detail' todo.id %}" >{{ todo.todo_name }}</a>
</div>
<div class="col-sm-6">
</div>
<div class="col-sm-1">
{% bootstrap_icon "ok" %}
{% bootstrap_icon "remove-circle" %}
</div>
</div>
</li>
{% endif %}
{% endfor %}
</ul>
<ul class="list-group">
{% for todo in todo_list %}
{% if todo.todo_completed %}
<li class="list-group-item">
<div class="row">
<div class="col-sm-5">
{{ todo.todo_name }}
</div>
<div class="col-sm-6">
</div>
<div class="col-sm-1">
{% bootstrap_icon "ok" %}
{% bootstrap_icon "remove-circle" %}
</div>
</div>
</li>
{% endif %}
{% endfor %}
</ul>
I have created a admin panel on the frontend and would like to show different layouts if they are on the index.html or if they are on pages after /admin e.g:
/admin/dashboard
/admin/posts
/admin/media
My if statement:
{% if request.path == "/admin" %}
It doesn't work for some reason and I can't figure out why. This is an example of the whole if:
<div class="row">
{% if request.path == "/admin" %}
<div class="col-md-full">
{% else %}
<div class="col-md-7 left">
{% block main %}{% endblock %}
</div>
{% endif %}
{% if request.path == "/admin" %}
{% trans "Empty" %}
{% else %}
<div class="col-md-3 right">
<div class="panel panel-default">
<div class="panel-body">
{% block right_panel %}
{% endblock %}
</div>
</div>
</div>
{% endif %}
</div>
what about?
{% if '/admin/' in request.path %}
I have a django for loop that is supposed to add items inside a form element. However, when the code executes, django just puts the first element inside the form and puts the following element outside the form html tag.
The code is:
<form action="." method="post" class="basket_summary" id="basket_formset">
{% csrf_token %}
{{ formset.management_form }}
{% for form in formset %}
{% with line=form.instance product=form.instance.product %}
{% purchase_info_for_line request line as session %}
<div class="row no-margin cart-item">
{{ form.id }}
<div class="col-xs-12 col-sm-2 no-margin">
{% with image=product.primary_image %}
{% thumbnail image.original "100x100" upscale=True as thumb %}
<a href="{{ product.get_absolute_url }}" class="thumb-holder">
<img class="lazy" alt="" src="{{ thumb.url }}" />
</a>
{% endthumbnail %}
{% endwith %}
</div> <!-- /.thumbnail holder -->
<div class="col-xs-12 col-sm-5 ">
<div class="title">
{{ line.description }}
</div>
{% trans "Update" %}
{% if user.is_authenticated %}
| {% trans "Save for later" %}
{% endif %}
<div style="display:none">
{{ form.save_for_later }}
{{ form.DELETE }}
</div>
{% for field_errors in form.errors.values %}
{% for error in field_errors %}
<span class="error-block"><i class="icon-exclamation-sign"></i> {{ error }}</span>
{% endfor %}
{% endfor %}
</div> <!-- /.Title holder -->
<div class="col-xs-12 col-sm-3 no-margin">
<div class="quantity">
<div class="le-quantity">
<form>
<a class="minus" href="#reduce"></a>
<input name="form-0-quantity" id="id_form-0-quantity" readonly="readonly" type="text" value="{{ form.quantity.value }}" />
<a class="plus" href="#add"></a>
</form>
</div>
</div>
</div><!-- /.Quantity Holder -->
<div class="col-xs-12 col-sm-2 no-margin">
<div class="price">
{% if line.is_tax_known %}
{{ line.unit_price_incl_tax|currency:line.price_currency }}
{% else %}
{{ line.unit_price_excl_tax|currency:line.price_currency }}
{% endif %}
</div>
</div> <!-- /.Price Holder -->
</div><!-- /.cart-item -->
{% endwith %}
{% endfor %}</form>
What I expect is that django should have multiple <div class="row no-margin cart-item"> items in the form tag but that isn't happening.
How do I fix this?
Looks like you are missing closing form tag </form> at the end.
EDIT: as others mentioned in comments it could be because you have forms inside form. This will result in unpredictable behavior.
This is what I currently has to check if the author has some photos in the related photo model:
{% if author.photo_set.count > 0 %}
<h2>...</h2>
<div style="clear: both;"></div>
<div class="author_pic">
{% for photo in author.photo_set.all %}
<img src="..." />
{% endfor %}
<div style="clear: both;"></div>
</div>
<div style="clear: both;"></div>
{% endif %}
Is this the right way or I can avoid having two queries somehow?
Thanks.
You can use the with tag to avoid multiple queries.
{% with author.photo_set.all as photos %}
{% if photos %}
<h2>...</h2>
<div style="clear: both;"></div>
<div class="author_pic">
{% for photo in photos %}
<img src="..." />
{% endfor %}
<div style="clear: both;"></div>
</div>
<div style="clear: both;"></div>
{% endif %}
{% endwith %}
There is also the empty tag that you can use within a for loop, but that probably doesn't apply to your example.
https://docs.djangoproject.com/en/dev/ref/templates/builtins/?from=olddocs#for-empty
<ul>
{% for athlete in athlete_list %}
<li>{{ athlete.name }}</li>
{% empty %}
<li>Sorry, no athlete in this list!</li>
{% endfor %}
<ul>
AS #pyrospade suggsted, you can look if the photos object exists. Or you could also check the length (check the length template tag) of the list of photo_set as follows:
{% if author.photo_set.all|length > 0 %}
<h2>...</h2>
<div style="clear: both;"></div>
<div class="author_pic">
{% for photo in author.photo_set.all %}
<img src="..." />
{% endfor %}
<div style="clear: both;"></div>
</div>
<div style="clear: both;"></div>
{% endif %}