logo oujood
🔍

Les variables de la boucle for dans les templates Django

Ces variables intégrées vous donnent accès à l'index courant, à la position dans la liste et à l'état de chaque itération — sans modifier le fichier views.py.

OUJOOD.COM

Les variables compteur de la boucle for dans les templates Django

Quand vous parcourez une liste avec {% for %} dans un template Django, vous n'avez pas accès qu'aux données de la liste. Django met aussi à votre disposition un ensemble de variables qui décrivent l'état de la boucle à chaque itération. Pas besoin de toucher à views.py pour ça.

Voici les six variables disponibles :

forloop.counter : numéro de l'itération courante, en commençant à 1.
forloop.counter0 : même chose, mais à partir de 0.
forloop.revcounter : compte à rebours depuis la fin de la liste, jusqu'à 1.
forloop.revcounter0 : même compte à rebours, mais se termine à 0.
forloop.first : vaut True uniquement pour le premier élément, False pour tous les autres.
forloop.last : vaut True uniquement pour le dernier élément, False pour tous les autres.

Ajouter un index à une liste avec forloop.counter

Pour illustrer l'utilisation de ces variables, reprenons une liste de voitures déjà utilisée dans le chapitre précédent. Dans sa version de base, le tableau n'affiche pas de numéro de ligne. En ajoutant forloop.counter dans le template, chaque ligne obtient automatiquement son index — sans modifier views.py.

Voici d'abord le code de départ, avec la liste de voitures définie dans views.py :

  📋 Copier le code

from django.http import HttpResponse
from django.template import loader

def testing(request):
  template = loader.get_template('template.html')
  context = {
   'voitures': [
{'marque': 'BUGATTI' , 'annee': '1909'},
{'marque':'CHRYSLER', 'annee':'1970-1979' },
{'marque':'CITROËN', 'annee':'Depuis 1919' },
{'marque':'DS', 'annee':'2014'},
{'marque':'DELAHAYE','annee':'1935-1954'},
{'marque':'FACEL-VEGA','annee':'1954-1964'},
{'marque':'FORD','annee':'1916-1954'},
{'marque':'PANHARD','annee':'1890-1967'},],   
  }
  return HttpResponse(template.render(context, request)) 

Le template de base, sans index, ressemble à ceci :

  📋 Copier le code

<!DOCTYPE html>
<html>
<body>
<h1>Marques de voitures françaises :</h1>
<table>
<tr><th>Marque</th><th>Année</th></tr>
{% for x in voitures %}
  <tr>
    <td>{{ x.marque }}</td>
    <td>{{ x.annee }}</td>
  </tr>
{% endfor %}
</table>
</body>
</html>

Pour ajouter une colonne d'index, il suffit d'insérer {{ forloop.counter }} dans le template. Aucune modification côté Python :

  📋 Copier le code

<!DOCTYPE html>
<html>
<body>
<h1>Marques de voitures françaises :</h1>
<table>
<tr><th>Index</th><th>Marque</th><th>Année</th></tr>
{% for x in voitures %}
  <tr>
    <td>{{ forloop.counter }}</td> <!-- index commençant à 1 -->
    <td>{{ x.marque }}</td>
    <td>{{ x.annee }}</td>
  </tr>
{% endfor %}
</table>
</body>
</html>

Testez aussi les autres variantes du compteur en remplaçant forloop.counter dans votre template :

  • forloop.counter0 — index démarrant à 0
  • forloop.revcounter — compte à rebours depuis le dernier élément jusqu'à 1
  • forloop.revcounter0 — même compte à rebours, se terminant à 0

Mettre en évidence un élément avec forloop.first et forloop.last

Les variables forloop.first et forloop.last renvoient respectivement True pour le premier et le dernier élément de la liste — False pour tous les autres. Leur usage le plus courant est d'appliquer un style visuel spécifique à ces éléments directement dans le template, sans logique supplémentaire dans views.py.

Dans l'exemple ci-dessous, on utilise forloop.first pour colorer le fond de la première ligne en bleu clair. On garde la même liste de voitures, seul le template est modifié :

  📋 Copier le code

<!DOCTYPE html>
<html>
<body>
<h1>Marques de voitures françaises :</h1>
<table>
<tr><th>Index</th><th>Marque</th><th>Année</th></tr>
{% for x in voitures %}
  <tr {% if forloop.first %}style="background-color:lightblue;"{% endif %}>
    <td>{{ forloop.counter }}</td>
    <td>{{ x.marque }}</td>
    <td>{{ x.annee }}</td>
  </tr>
{% endfor %}
</table>
</body>
</html>

Le même principe s'applique avec forloop.last pour cibler le dernier élément. Vous pouvez aussi combiner les deux dans une même boucle pour styliser différemment la première et la dernière ligne du tableau.


Par carabde | Mis à jour le 21 mai 2026