#solved Data not showing on Django Template

I don't know why it isn't showing on the templates when I think I implemented it right.

the template is :

              <div class="row">
              {% for volunteer_name in volunteer %}
                <div class="col-md-4 col-sm-6">
                  <div class="team-wrapper">
                      <div class="team-img">
                          <img src="{{ volunteer_name.img.url }}" class="img-responsive" alt="Image">
                      </div><!-- /.team-img -->

                      <div class="team-title">
                          <h3><a href="#">{{ volunteer_name.name }}</a></h3>
                      </div><!-- /.team-title -->


                  </div><!-- /.team-wrapper -->
              {% endfor %}
                </div><!-- /.col-md-4 -->

              </div><!-- /.row -->

models.py is:

class Volunteer(models.Model):
    image = models.ImageField(max_length=100, upload_to='volunteer/')
    name = models.CharField(max_length=100)
    facebook = models.CharField(max_length=100, validators=[URLValidator])
    twitter = models.CharField(max_length=100, validators=[URLValidator])
    linkedin = models.CharField(max_length=100, validators=[URLValidator])

    def __str__(self):
        return self.name

views.py

def home(request):
    amlvideo = AMLVideo.objects.filter().order_by("-category", "-language", "-level")
    volunteer_name = Volunteer.objects.all()
    img = Volunteer.objects.all()
    context = {"home": home}
    return render(request, "aml/home.html", context)

Can someone help me?

Comments

[Taleb]

you are setting context to home but home is set to anything. maybe you want
context = {'volunteer_name': volunteer_name, }

[Vicente G. Reyes]

Hey thanks for replying. I tried this but is still not showing data on the front.

[Taleb]

Can you try this.

render(request, "aml/home.html", {'volunteer_name': volunteer_name, })

[Vicente G. Reyes]

Data still didn't show. Do you think it's a bug on Django 2.2.4?

[Alaa]

me too some template would show data but other wont even when i use the same even when i use the same way to display the data

[Emmanuel Awotunde]

Your view is not well structured. I see you repeating Volunteer.objects.all() twice. Also, your context is sending in a request obj, you are supposed to send the data that you fetched from your database i.e Volunteer.objects.all(). Also what's the amlvideo = AMLVideo.objects.filter().order_by("-category", "-language", "-level") for? You are not sending it to the template

[Vicente G. Reyes]

Ok so I removed the other Volunteer.objects.all() already. I would send those to the template. Just not on this model. How am I supposed to send the data form my database then?

[Emmanuel Awotunde]

I think you can restructure your view to look like this:

def home(request):
    aml_videos = AMLVideo.objects.filter().order_by("-category", "-language", "-level")
    volunteers = Volunteer.objects.all()
    context = {'aml_videos': aml_videos, 'volunteers': volunteers}
    return render(request, "aml/home.html", context)

Then your template would look like this:

 <div class="row">
    {% for volunteer in volunteers %}
        <div class="col-md-4 col-sm-6">
            <div class="team-wrapper">
                <div class="team-img">
                    <img src="{{ volunteer.img.url }}" class="img-responsive" alt="Image">
                </div><!-- /.team-img -->

                <div class="team-title">
                    <h3><a href="#">{{ volunteer.name }}</a></h3>
                </div><!-- /.team-title -->

            </div><!-- /.team-wrapper -->
        </div><!-- /.col-md-4 -->
    {% endfor %}
</div><!-- /.row -->

[Vicente G. Reyes]

This solved the problem. Thank you!

[Emmanuel Awotunde]

Anytime!

[Alyss 💜]

Thanks for helping folks out and welcome to Dev.to!

[Emmanuel Awotunde]

My pleasure!

[Rashid]

I think it is small loop issue

              <div class="row">
              {% for name in volunteer_name %}
                <div class="col-md-4 col-sm-6">
                  <div class="team-wrapper">
                      <div class="team-img">
                          <img src="{{ name.img.url }}" class="img-responsive" alt="Image">
                      </div><!-- /.team-img -->

                      <div class="team-title">
                          <h3><a href="#">{{ name.name }}</a></h3>
                      </div><!-- /.team-title -->


                  </div><!-- /.team-wrapper -->
              {% endfor %}
                </div><!-- /.col-md-4 -->

              </div><!-- /.row -->

and context should be

context = {"volunteer_name": volunteer_name}

[Vicente G. Reyes]

Fixed it already with this plus the

<img src="{{ volunteer.image.url }}" class="img-responsive" alt="Image">

Now the image doesn't show

[Juha-Matti Santala]

Your view is not sending any sensible data. It's sending the view function itself.

Try this:

def home(request):
    volunteer = Volunteer.objects.all()
    return render(request, 'aml/home.html', { 'volunteer': volunteer })

I think that should display the data correctly. At that point, we can refactor a bit to make the code easier to read. Now you're using volunteer (in your template) as a variable name but in view, it contains all volunteers.

So maybe renaming the volunteer into volunteers and then in your template code:

  {% for volunteer_name in volunteer %}

into

  {% for volunteer in volunteers %}

and then replacing all volunteer_name with volunteer since you're passing in the entire model object, not just their name.

Let me know if the first bit works!

[Juha-Matti Santala]

After the refactoring, it would look like this

Template:

<div class="row">
    {% for volunteer in volunteers %}
        <div class="col-md-4 col-sm-6">
            <div class="team-wrapper">
                <div class="team-img">
                    <img src="{{ volunteer.img.url }}" class="img-responsive" alt="Image">
                </div>
                <div class="team-title">
                    <h3>
                        <a href="#">{{ volunteer.name }}</a>
                    </h3>
                </div>
            </div>
        {% endfor %}
    </div>
</div>

View:

def home(request):
    volunteers = Volunteer.objects.all()
    return render(request, "aml/home.html", { 'volunteers': volunteers })

(the model looks good as is)