issue with html display in Django maybe coming from view.py structure

Question

I am building a django app and i am very not familiar with the frontend stuff. Ultimately i want to build a dashboard but as now I am somewhat struggling with building a view that matches what I want it to display.

So far the view class is well transfered to frontend (no error when running the server), but instead of displaying values, it displays black dots. here is attached my models, html code as well as my view.py

class Classification(models.Model):
    Class = models.CharField(max_length=10, primary_key=True)
    revenue_proportion = models.FloatField(default=0)
    Quantity_of_item = models.IntegerField(default=0)
    percentage_of_items = models.FloatField(default=0)
    cumul_percentage_of_items = models.FloatField(default=0)
    inventory_dollars = models.FloatField(default=0)
    inventory_dollars_percentage = models.FloatField(default=0)
    cumul_inventory_dollars_percentage = models.FloatField(default=0)
    average_margin = models.FloatField(default=0)
    average_sales_week = models.FloatField(default=0)
    weekly_percentage_sales = models.FloatField(default=0)

    def __str__(self):
        return self.Class


class stock_anormal(models.Model):
    reference_anormales = models.CharField(max_length=10, primary_key=True)
    stock_alerte_calcule = models.FloatField(default=0)
    stock_alerte_recommande = models.FloatField(default=0)
    en_alerte = models.FloatField(default=0)

    def __str__(self):
        return self.reference_anormales


class stock_negatif(models.Model):
    reference_negatives = models.CharField(max_length=10,primary_key=True)
    stock_alerte_calcule = models.FloatField(default=0)
    stock_alerte_recommande = models.FloatField(default=0)
    risque_de_rupture = models.FloatField(default=0)

    def __str__(self):
        return self.reference_negatives




class niveau_service(models.Model):
    reference_service = models.CharField(max_length=10, primary_key=True)
    niveau_service_calcule = models.FloatField(default=0)
    niveau_service_recommande = models.FloatField(default=0)
    alerte_niveau_service = models.FloatField(default=0)

    def __str__(self):
        return self.reference_service


class top_sellers(models.Model):
    reference = models.CharField(max_length=10, primary_key=True)
    avg_per_week = models.FloatField(default=0)


    def __str_(self):
        return self.reference

  <ul>

        {% for reference in top_sellers_list %}
            <li><a href="/dashboard/{{ top_sellers_list.reference }}/"> {{top_sellers_list.avg_per_week }}</a></li>
        {% endfor %}

    </ul>

    <ul>

        {% for reference in classification %}
             <li><a href="/dashboard/{{ classification.Class }}/"> {{classification.inventory_dollars }}</a></li>
        {% endfor %}

    </ul>

    <ul>

        {% for reference in anormal %}
             <li><a href="/dashboard/{{ anormal.reference_anormales }}/"></a></li>
        {% endfor %}

    </ul>


    <ul>

        {% for reference in negat %}
             <li><a href="/dashboard/{{ negat.reference_negatives }}/"></a></li>
        {% endfor %}

    </ul>

    <ul>

        {% for reference in service %}
             <li><a href="/dashboard/{{ service.reference_service }}/"></a></li>
        {% endfor %}

    </ul>

from django.shortcuts import render, get_object_or_404
from django.http import HttpResponse, Http404
from .models import top_sellers, Classification, stock_anormal, stock_negatif, niveau_service


# Create your views here.

def dashboard(request):
    top_sellers_list = top_sellers.objects.order_by('avg_per_week')[:8]
    classification = Classification.objects.order_by('Class')
    anormal = stock_anormal.objects.order_by('reference_anormales')
    negat = stock_negatif.objects.order_by('reference_negatives')
    service = niveau_service.objects.order_by('reference_service')




    context1 = { 'top_sellers_list' : top_sellers_list,
                 'classification' : classification,
                 'anormal' : anormal,
                 'negat' : negat,
                 'service' : service

                 }


    return render(request, 'dashboard/index.html', context1)

and the display hmtl:

I am confused about what is going wrong and was wondering if somebody has a clue what is wrong and whether this is an efficient way to structure my view class knowing that I want to use all this data to make a dashboard.

Answer 1

You are referencing the wrong variables in your for loop. You must use the variable name declared after the for word to reference the instance inside the loop.

<ul>
    {% for t in top_sellers_list %}
        <li><a href="/dashboard/topsellers/{{ t.id }}/">{{t.avg_per_week }}</a></li>
    {% endfor %}
</ul>
<ul>
    {% for c in classification %}
         <li><a href="/dashboard/classifications/{{ c.id }}/"> {{c.inventory_dollars }}</a></li>
    {% endfor %}
</ul>
<ul>
    {% for a in anormal %}
         <li><a href="/dashboard/anormals/{{ a.id }}/">{{ a.reference_anormales }}</a></li>
    {% endfor %}
</ul>
<ul>
    {% for n in negat %}
         <li><a href="/dashboard/negats/{{ n.id }}/">{{ n.reference_negatives }}</a></li>
    {% endfor %}
</ul>
<ul>
    {% for s in service %}
         <li><a href="/dashboard/services/{{ s.id }}/">{{ s.reference_service }}></a></li>
    {% endfor %}
</ul>

Note that I changed the links as well just for example