Django Display Database Records in a Table

Print

Go ahead and create a few tasks from admin panel first.

Import Task model to views.py

from crmapp.models import Task

Modify crmapp view

def crmapp(request):
    tasks_obj = Task.objects.all
    return render(request, 'crmapp.html', {"alltasks": tasks_obj} )

 

Also change crmapp.html like this and call alltasks

{% extends 'base.html' %}
{% block title %}
    <title>CrmApp</title>
{% endblock title %}

{% block content %}
    <div class="container">
        {{alltasks}}
    </div>
{% endblock content %}

 

{{alltasks}} will return the querysets like this when crmapp visited

 

We should use a for loop in crmapp.html to retrieve the database record values

{% extends 'base.html' %}
{% block title %}
    <title>CrmApp</title>
{% endblock title %}

{% block content %}
    <div class="container">
        {% for task in alltasks%}
        {{task.id}} - 
        {{task.subject}} - 
        {{task.status}} - 
        {{task.created}} - 
        {{task.deadline}} -
        {{task.assigned_sd}} -
        {{task.assigned_department}} -
        {{task.assigned_user}} -
        {{task.createdby}} -
        {{task.request_owner}} -
        {{task.taken}}
        <br>
        {% endfor %}

    </div>
{% endblock content %}

 

And it will show data like this. We need a table to properly show this data.

 

I added a table to crmapp.html like this

{% extends 'base.html' %}
{% block title %}
    <title>CrmApp</title>
{% endblock title %}

{% block content %}
    <div class="container">
            <table class="table">
                <thead class="thead-dark">
                    <tr>
                    <th scope="col">TaskID</th>
                    <th scope="col">Subject</th>
                    <th scope="col">Status</th>
                    <th scope="col">Created</th>
                    <th scope="col">Deadline</th>
                    <th scope="col">Subdivision</th>
                    <th scope="col">Department</th>
                    <th scope="col">Assigned User</th>
                    <th scope="col">Created By</th>
                    <th scope="col">Request Owner</th>
                    <th scope="col">Taken</th>
                    </tr>
                </thead>
                <tbody>
                    {% for task in alltasks %}
                        <tr>
                        <td>{{task.id}}</td>
                        <td>{{task.subject}}</td>
                        <td>{{task.status}}</td>
                        <td>{{task.created}}</td> 
                        <td>{{task.deadline}}</td>
                        <td>{{task.assigned_sd}}</td>
                        <td>{{task.assigned_department}}</td>
                        <td>{{task.assigned_user}}</td>
                        <td>{{task.createdby}}</td>
                        <td>{{task.request_owner}}</td>
                        <td>{{task.taken}}</td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>    
    </div>
{% endblock content %}

 

and the result

 

 I modified the format of date and time for task created and deadline values 

<td>{{task.created |date:"d M Y"}} {{task.created |date:"H:i"}}</td> 
<td>{{task.deadline|date:"d M Y"}}</td>