How to format template with django?-CodePudding

I have a django application. And I try to format some data.

So I have this method:


from __future__ import print_function

import locale
import re
from fileinput import filename
from itertools import zip_longest
from locale import LC_NUMERIC, atof

import pandas as pd
from tabulate import tabulate

class FilterText:

def show_extracted_data_from_file(self):
       

        verdi_total_fruit = [12, 13, 14]
        verdi_fruit_name = ["watermeloenen", "appels", "winterpeen"]
        verdi_cost = [123, 55, 124, 88, 123, 123]

        regexes = [verdi_total_fruit, verdi_fruit_name, verdi_cost]
        matches = [(regex) for regex in regexes]       
       
        return tabulate(
            zip_longest(*matches),  # type: ignore
            headers=[
                "aantal fruit",
                "naam fruit",
                "kosten fruit",
            ],
        )

views:

def test(request):
    filter_text = FilterText()
    content = ""
    content = filter_text.show_extracted_data_from_file()
    context = {"content": content}
    return render(request, "main/test.html", context)

template


<!DOCTYPE html>
<html lang="en">

    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Create a Profile</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
        <link rel="stylesheet" type="text/css" href="{% static 'main/css/custom-style.css' %}" />
        <link rel="stylesheet" type="text/css" href="{% static 'main/css/bootstrap.css' %}" />
    </head>

    <body>
        <div >
            <span  role="form">
                <div >
                    <form  action="/controlepunt140" method="POST" enctype="multipart/form-data">

                        <div >
                            <div >                                

                            </div>
                            <div >
                                <div >
                                    <div >
                                        {{content}}
                                    </div>
                                </div>
                            </div>
                        </div>
                </div>
            </span>
            <span  role="form">
                <div >
                    <div >
                        <div >

                           
                        </div>
                    </div>
                </div>
            </span>

            </form>
        </div>
    </body>
</html>

that produces this result:

 aantal fruit naam fruit kosten fruit -------------- ------------- -------------- 12 watermeloenen 123 13 appels 55 14 winterpeen 124 88 123 123

but as you can see it is one horizontal output.

But I want every item under each other. that it will looks like:

6  Watermeloenen 577,50
75 Watermeloenen  69,30
9  watermeloenen  46,20

a Question: how to format the template?

if I do this:

 print(tabulate(
            zip_longest(*matches),  # type: ignore
            headers=[
                "aantal fruit",
                "naam fruit",
                "kosten fruit",
            ],
        ))

it looks correct:

 aantal fruit  naam fruit     kosten fruit
--------------  -------------  --------------
            16  Watermeloenen  123,20
           360  Watermeloenen  2.772,00
             6  Watermeloenen  46,20
            75  Watermeloenen  577,50
             9  Watermeloenen  69,30
           688  Appels         3.488,16
            22  Sinaasappels   137,50
            80  Sinaasappels   500,00
           160  Sinaasappels   1.000,00
           320  Sinaasappels   2.000,00
           160  Sinaasappels   1.000,00
            61  Sinaasappels   381,25

But not in the template

so this:

  return tabulate(
            zip_longest(*matches),  # type: ignore
            headers=[
                "aantal fruit",
                "naam fruit",
                "kosten fruit",
            ],tablefmt="html"
        )

then the output is this:

<table> <thead> <tr><th style="text-align: right;"> aantal fruit</th><th>naam fruit </th><th style="text-align: right;"> kosten fruit</th></tr> </thead> <tbody> <tr><td style="text-align: right;"> 12</td><td>watermeloenen</td><td style="text-align: right;"> 123</td></tr> <tr><td style="text-align: right;"> 13</td><td>appels </td><td style="text-align: right;"> 55</td></tr> <tr><td style="text-align: right;"> 14</td><td>winterpeen </td><td style="text-align: right;"> 124</td></tr> <tr><td style="text-align: right;"> </td><td> </td><td style="text-align: right;"> 88</td></tr> <tr><td style="text-align: right;"> </td><td> </td><td style="text-align: right;"> 123</td></tr> <tr><td style="text-align: right;"> </td><td> </td><td style="text-align: right;"> 123</td></tr> </tbody> </table>

CodePudding user response：

The tabulate package requires a third parameter tablefmt in order to output HTML, so you need to pass tablefmt="html" to the tabulate() function after headers.

    return tabulate(
        zip_longest(*matches),  # type: ignore
        headers=[
            "aantal fruit",
            "naam fruit",
            "kosten fruit",
        ],
        tablefmt="html",
    )

You will need to wrap this output with mark_safe() from django.utils.safestring.

Note that this produces an entire HTML table with all tags, so instead of looping over the table rows you can simply output content by itself:

<div >
    {{ content }}
</div>

At this point it's worth renaming content to something more appropriate like table.