DEV Community

#solved Data not showing on Django Template

Vicente G. Reyes on August 25, 2019

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">...
Read full post
Collapse
 
olaoluwa98 profile image
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

Collapse
 
highcenburg profile image
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?

Collapse
 
olaoluwa98 profile image
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 -->
Thread Thread
 
highcenburg profile image
Vicente G. Reyes •

This solved the problem. Thank you!

Thread Thread
 
olaoluwa98 profile image
Emmanuel Awotunde •

Anytime!

Thread Thread
 
preciselyalyss profile image
Alyss 💜 •

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

Thread Thread
 
olaoluwa98 profile image
Emmanuel Awotunde •

My pleasure!

Collapse
 
hamatti profile image
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!

Collapse
 
hamatti profile image
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)

Collapse
 
thedevtimeline profile image
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}
Collapse
 
highcenburg profile image
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

Collapse
 
taleb profile image
Taleb •

Can you try this.

render(request, "aml/home.html", {'volunteer_name': volunteer_name, })
Enter fullscreen mode Exit fullscreen mode
Collapse
 
highcenburg profile image
Vicente G. Reyes •

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

Collapse
 
cyb3rchamp profile image
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

Collapse
 
taleb profile image
Taleb •

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

Collapse
 
highcenburg profile image
Vicente G. Reyes •

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