i have a html page in my django templates, its a pdf type, the for loop should make a transactions based on the number of which the object model returns, however i want every transaction to be in a full html page, and the other transaction come net page, i have tried to do it but seems a bit hard since im new to django html.
{% extends "base.html" %}
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
{% block title %} Report {% endblock title %}
<div id="container">
{% block content %}
{% for transaction in transactions %}
{% if transaction.complete %}
<table class="tg">
<thead>
<tr>
<th class="tg-fv77" colspan="12" rowspan="2"><span style="color:#3531FF">Report For Tenant ( {{ transaction.chp_reference }} )</span></th>
</tr>
<tr>
</tr>
</thead>
<tbody>
<tr>
<td class="tg-0pky" colspan="9">CHP Reference</td>
<td class="tg-0pky" colspan="3">{{transaction.chp_reference}}</td>
</tr>
<tr>
<td class="tg-0pky" colspan="9">Rent Effective From (dd/mm/yyyy)</td>
<td class="tg-0pky" colspan="3">{{transaction.rent_effective_date}}</td>
</tr>
<tr>
<td class="tg-0lax" colspan="9">CRA Fortnightly Rates valid for 6 months from</td>
<td class="tg-0lax" colspan="3">{{transaction.cra_rate_from}}</td><hr>
</tr>
<tr>
<td class="tg-0lax" colspan="9">Market Rent of the Property</td>
<td class="tg-0lax" colspan="3">{{transaction.property_market_rent}}</td>
</tr>
<tr>
<td class="tg-0lax" colspan="9">Number of Family Group(s)</td>
<td class="tg-0lax" colspan="3">{{transaction.number_of_family_group}}</td>
</tr>
</tbody>
</table>
{% if transaction.complete %}
<table class="tg" style="undefined;table-layout: fixed; width: 714px">
<colgroup>
<col style="width: 86px">
<col style="width: 201px">
<col style="width: 109px">
<col style="width: 63px">
<col style="width: 121px">
<col style="width: 134px">
</colgroup>
<thead>
<tr>
{% for f in transaction.family_groups.all %}
<th style="text-align:left">Family No</th>
<th style="text-align:left">Income Type</th>
<th style="text-align:left">Name</th>
<th style="text-align:left">Rent %</th>
<th style="text-align:left">Weekly Income</th>
<th style="text-align:left"><span style="background-color:#ffe0c7">Rent Component</span></th>
</tr>
</thead>
<tbody>
<tr>
<td class="tg-4erg">{{f.name}}</td>
<td >{% for m in f.family_members.all %}{{ m.num_of_family_members }}<br>{% endfor %}</td>
<td >{% for m in f.family_members.all %} {{m.name}} <br> {% endfor %}</td>
<td class="tg-4erg">{% for m in f.family_members.all %} {{m.effective_rent_percentage}} <br> {% endfor %}
</td>
<td class="tg-4erg">{% for m in f.family_members.all %} {{m.income}} <br> {% endfor %}</td>
<td class="tg-1qbe">{% for m in f.family_members.all %} {{m.income_component|stringformat:".2f"}} <br> {% endfor %}</td>
</tr>
<tr>
</tr>
</thead>
<tbody>
<tr>
<td class="tg-0pky" colspan="9">CHP Reference</td>
<td class="tg-0pky" colspan="3">{{transaction.chp_reference}} Insufficient Info.</td>
<hr>
</tr>
</tbody>
</table>
{% endif %}
</table>
{% endfor %}
{% endblock content %}
</div>
</html>
You can convert a html file to a pdf using xhtml2pdf.There are many other alternatives to it as well.
from django.template.loader import get_template,render_to_string
import xhtml2pdf.pisa as pisa
from io import BytesIO
def render_to_file(path: str, params: dict):
template = get_template(path)
html = template.render(params)
file_name = "report.pdf"
file_path = os.path.join(os.path.abspath(os.path.dirname("__file__")), "charts", file_name)
with open(file_path, 'wb') as pdf:
pisa.pisaDocument(BytesIO(html.encode("UTF-8")), pdf, link_callback=BASE_DIR + '/static/charts/Logo/')
return [file_name, file_path]
where 'path' is the path to your html template and params is the contect dictionary (transaction data in your case).
Do read the documentation of xhtml2pdf as it doesn't support all the css that you would apply to a normal html page.
Related
I'm trying to create a simple table. I would like a footer with only one cell but I don't know why it's divided in two. Any idea?
<table class="table-cart-view-producer">
<thead>
<tr>
<th>Produit</th>
<th>Quantité</th>
<th>Prix</th>
</tr>
</thead>
<tfoot>
<tr>
<th> Prix Total du Panier : <strong>{{cart_price}}€</strong></th>
</tr>
</tfoot>
<tbody>
{% for item in cartitems %}
<tr>
<td>{{item.stock_item.product_stockitem.name}}</td>
<td>{{item.quantity}} {{item.stock_item.product_stockitem.unit}}</td>
<td>{{item.get_total_price}}€</td>
</tr>
{% endfor %}
</tbody>
</table>
It renders this way:
I'm currently trying to display a bunch of Information of a model inside the template.
Therefore I've been creating a table to show all of the information horizontally for every "previous game" in the database:
<table style="height: 100%">
{% for previous_game in previous_games %}
<tr>
<th> {{ previous_game.name }}</th>
</tr>
<tr>
<td> <img id="Videogame_Picture" src="{{ previous_game.image.url }}"> </td>
</tr>
<tr>
<td> {{ previous_game.date }} </td>
</tr>
<tr>
<td> {% load static %} <img id= "Result_Icon" src="{% static previous_game.min_req %} "></td>
</tr>
<tr>
<td> {% load static %} <img id= "Result_Icon" src="{% static previous_game.rec_req %} " ></td>
</tr>
<tr>
<td> PC Rig {{ previous_game.config }}</td>
</tr>
{% endfor %}
</table>
It shall look like this:
But currently all the Table columns are displaying vertically underneath instead of horizontally next to each previous game and I can't figure out why.
Can you help me out here?
Thanks in Advance!
I would have all my headers in the first row and then start looping through my games with a row per game and cells (td) for each game attribute:
<table style="height: 100%">
<tr>
<th> previous game name </th>
<th> image </th>
<th> previous game date </th>
<th> previous game result 1 </th>
<th> previous game result 2 </th>
<th> PC Rig </th>
</tr>
{% for previous_game in previous_games %}
<tr>
<td> {{ previous_game.name }} </td>
<td> <img id="Videogame_Picture" src="{{ previous_game.image.url }}"> </td>
<td> {{ previous_game.date }} </td>
<td> {% load static %} <img id= "Result_Icon" src="{% static previous_game.min_req %} "> </td>
<td> {% load static %} <img id= "Result_Icon" src="{% static previous_game.rec_req %} " ></td>
<td>{{ previous_game.config }}</td>
</tr>
{% endfor %}
</table>
Alright I got a solution:
Since I created a Row for every Information of the "previous game" - Object, in every loop, I needed to put the loop inside the Row, for being able to only create the Row once.
Now it looks like this:
<table style="height: 150px; border: 1px solid black; width: 600px">
<tr>
{% for previous_game in previous_games %}
<th> {{ previous_game.name }}</th>
{% endfor %}
</tr>
<tr>
{% for previous_game in previous_games %}
<td> <img id="Videogame_Picture" src="{{ previous_game.image.url }}"> </td>
{% endfor %}
</tr>
<tr>
{% for previous_game in previous_games %}
<td> {{ previous_game.date }} </td>
{% endfor %}
</tr>
<tr>
{% for previous_game in previous_games %}
<td style="display: inline"> {% load static %} <img id= "Result_Icon" src="{% static previous_game.min_req %} "></td>
<td style="display: inline"> {% load static %} <img id= "Result_Icon" src="{% static previous_game.rec_req %} " ></td>
{% endfor %}
</tr>
<tr>
{% for previous_game in previous_games %}
<td> PC Rig {{ previous_game.config }}</td>
{% endfor %}
</tr>
</table>
It doesn't feel like the cleanest solution tbh, but it worked for me!
I have tried to make a page where one column is fixed and the other one is scrollable. In the template "Os name" and "{{ i.os_name }}", I want to make it fixed. All the other ones should be scrollable.
I have tried some solutions but I'm facing issues. I have pasted the CSS which I have tried. Please tell me where I am going wrong so I can make it correct.
<div>
<table class="table accountTable" id="book-table" cellpadding="0" cellspacing="0" style="width: 91%;">
<thead>
<tr class="accountBorder">
<th class="osfix">Os Name</th>
<th class="">Browser</th>
<th>IP Address</th>
<th>Location</th>
<th>Session Time</th>
<th>Activity</th>
</tr>
</thead>
<tbody>
{% for i in account %}
<tr>
<td><div class="osfixName">{{ i.os_name }}</div></td>
<td>
<div class = "title_elipses accordion">{{ i.browser }}</div>
<div class="panel" style="display: none;"><p>{{i.browser}}</p></div>
</td>
<td>
<div>{{ i.ip_address }}</div>
</td>
<td>
<div>{{ i.city }}, {{ i.country }}</div>
</td>
<td>
{% for key,value in some_date.items %}
{% if i.id == key %}
<!-- here we are displaying the age of the ad -->
<span class="dealpagetext">{{ value }}</span><br>
{% endif %}
{% endfor %}
<!-- <div>{{ i.last_loggedin }}</div>-->
</td>
<td>
{% if i.activity == 1 %}
<div>Signout</div>
{% else %}
<div></div>
{% endif %}
</td>
</tr>
{% empty %}
<tr>
<td colspan="7" class="text-center">No History</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
css
#book-table {
width: 131% !important;
margin-left: 111px;
}
.osfix {
position: fixed;
left: 0;
background-color: #ddd;
padding-left: 4px;
}
.osfixName {
position: fixed;
left: 0;
padding-left: 4px;
z-index: 88;
background-color: #fff;
}
I have a HTML table with checkboxes. I want to read the first column value based on the row selected using the checkbox. To read the values, a function is called after selecting the checkbox and clicking a button.
Table look this way
<a href="{% url 'app-analyze_retina' %}">
<button onclick="" class="patient-add-btn button1"> Send for Analysis </button>
</a>
{% if btn_clicked %}
<div>
<table class="table" id="patient_list">
<thead class="thead-dark">
<tr>
<th scope="col">Patient ID</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
<th scope="col">Result/Severity Level</th>
<th scope="col">Tested on</th>
<th scope="col">AI confidence</th>
<th scope="col">Comments</th>
</tr>
</thead>
<tbody>
{% for patient in data %}
<tr>
<td bgcolor="mediumaquagreen">
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" name="checks" id={{patient.0}} value="{{patient.1}}">
<label class="custom-control-label" for={{patient.0}}>{{patient.1}}</label>
</div>
<!-- <td bgcolor="mediumaquagreen" > {{ patient.1 }}</td>-->
<td bgcolor="mediumaquagreen">{{patient.2}}</td>
<td bgcolor="mediumaquagreen" >{{patient.3}}</td>
<td bgcolor="mediumaquagreen">2.846</td>
<td bgcolor="mediumaquagreen">-</td>
<td bgcolor="mediumaquagreen" >Cristina</td>
<td bgcolor="mediumaquagreen" >913</td>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endif %}
Function to read the values
def analyze_img(request):
c = request.POST.getlist('checks')
print(c)
return render(request, 'workspace.html')
First I was trying to check whether I am able to read a checkbox but it returns an empty list.
Hey i am fetching data from excel file but all the data is returning in only one row box this is my html code
{% block body %}
# i am using bootstrap table class
<table class="table table-bordered">
<thead>
<tr>
<th scope="col">Pensioner name</th>
<th scope="col">cnic</th>
<th scope="col">mobile</th>
<th scope="col">wallet</th>
</tr>
</thead>
<tr>
{% if 'm1' %}
<td><h6 >{{ m1 }}</h6></td>
{% endif %}
{% if 'm2' %}
<td><h6 >{{ m2 }}</h6></td>
{% endif %}
{% if 'm3' %}
<td><h6 >{{ m3 }}</h6></td>
{% endif %}
{% if 'm4' %}
<td><h6 >{{ m4 }}</h6></td>
{% endif %}
</tr>
</table>
{% endblock %}
this is my outputenter image description here
i want data into separate rows boxes now it looks to messy please help
To create a new row you would need to add a new <tr> element for each row.
Here is a working example
table,
tr,
th,
td {
border: solid 1px;
}
<table>
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Job Title</th>
</tr>
</thead>
<tbody>
<tr>
<td>James</td>
<td>Matman</td>
<td>Chief Sandwich Eater</td>
</tr>
<tr>
<td>The</td>
<td>Tick</td>
<td>Crimefighter Sorta</td>
</tr>
</tbody>
</table>
Each <tr> element inside the <tbody> element creates a new row.