Home > Net >  How do I map query results to an HTML table in python?
How do I map query results to an HTML table in python?

Time:04-14

I have two tables : Driver and Car

from django.db import models

# Create your models here.

class Driver(models.Model):
    name = models.TextField()
    license = models.TextField()

class Car(models.Model):
    make = models.TextField()
    model = models.TextField()
    year = models.IntegerField()
    vin = models.TextField()
    owner = models.ForeignKey("Driver", on_delete=models.SET_NULL, null=True)

And here is the data inside the tables:

INSERT INTO car_driver (name, license)
VALUES ('John Smith', 'ZX1092931i'),
        ('Karen Doe', 'KOanksndan');


INSERT INTO car_car (make, model, year, vin, owner_id)
VALUES
    ('Mercedes', 'Legend', 2009, '912asdasda12', 1),
    ('Nissan', 'Altima', 2002, 'a9a98aa7a772', 1),
    ('Lada', 'Kalina', 1987, 'SU91991', 2),
    ('BMW', 'Challenger', 2013, 'BM91818X', 2);

It doesn't matter what type of query I do, I would like to display an empty html table, and depending on the query the results get populated

from django.shortcuts import render
from car.models import Car, Driver
# Create your views here.


def car_detail(request, pk):
    owner_obj = Driver.objects.get(pk=pk)
    car_objs = Car.objects.filter(owner_id=owner_obj.id)
    context = {
        "vehicles": car_objs,
        "drivers": owner_obj,
    }

    return render(request, "v2.html", context)

And here is the html:

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Contacts</title>
        <link rel="stylesheet" href="https://unpkg.com/[email protected]/css/tachyons.min.css"/>
    </head>

    <body>
        <h1>V2</h1>

        <table>
            {% block page_content %}
            <tr>
                <th></th>
            </tr>
            {% endblock %}
        </table>
        

    </body>

</html>

I'm coming from Node/Express, the way I would do it there is with an array.map(), but how do go about doing this in python/django? I'm not sure how to use {% ... %}

CodePudding user response:

in your table, something like this:
{% for item in context.vehicles %}
   <tr>{{ item.make }}</tr> 
{% endfor %}

CodePudding user response:

As per your views, 'vehicles' in context object will be the queryset corresponding to the 'driver'. Since 'driver' will be a single object, I believe, you are looking to create a table based on 'vehicles' of context object. You can create one more key-value pair in context object that includes all column names.

        <table>
            <thead>
               <tr>
                {% for column in column_names %}
                    <td>{column}</td>
                {% endfor %}
               </tr>
            </thead>
            <tbody>
                {% for car in car_obj %}
                    <tr>
                        <td>{car.make}</td>
                        <td>{car.model}</td>
                        <td>{car.year}</td>
                        <td>{car.vin}</td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
  • Related