django - 通过分组在Django中显示数据
问题描述
基本上,我一直在从事这个项目,我一直在根据我的需要在 html 页面上显示数据。现在显示的只是 0-4 数据,但我不确定如何正确显示它。
对于孩子:我希望它显示用户的孩子。
对于时间线:根据选择的孩子,时间线表将显示来自特定孩子的数据。我想按年龄范围(列标题)对数据进行分组,然后单击时,它将显示与当前时间线单元格。
我的意见文件:
def timeline(request):
timeline = Timeline.objects.all()
return render(request, 'timeline.html', {
'timeline': timeline
})
我的模型文件:
HEADER_CHOICES = [
('Financial Support', 'Financial Support'),
('Educational Support', 'Educational Support'),
('Governmental Support', 'Governmental Support '),
('Charity Support Groups', 'Charity Support Groups'),
('Therapy Support', 'Therapy Support '),
('Transport Support', 'Transport Support ')
]
AGE_CHOICES = [
('0-4', '0-4'),
('4-11', '4-11'),
('11-18', '11-18'),
('18-25', '18-25')
]
class Timeline(models.Model):
header = models.CharField(max_length=30, choices=HEADER_CHOICES)
age = models.CharField(max_length=6, choices=AGE_CHOICES)
child = models.OneToOneField(Children, on_delete=models.CASCADE)
class Pdf(models.Model):
pdf = models.FileField(upload_to='timelinepdfs')
timeline = models.ForeignKey(Timeline, on_delete=models.CASCADE)
我的html页面:
{% extends 'pages/home_page.html' %}
{% block content %}
<style>
.rightMenu {
position:relative;
float:right;
}
.right-caret {
border-bottom: 4px solid transparent;
border-top: 4px solid transparent;
border-left: 4px solid #000000;
display: inline-block;
height: 0;
opacity: 1;
vertical-align: top;
width: 0;
}
.right
{
float:right;
}
.thead {
font-size: 28px;
}
</style>
<div class="span4">
<h1> Timeline</h1>
<label for="child">Choose a Child:</label>
<select id="child">
{% for tl in timeline %}
{% for child in tl.child_set.all %}
{% if timeline.child.parent == user.id %}
<option value="{{child.first_name}}">{{ child.first_name }} {{ child.last_name }}</option>
{% endif %}
{% endfor %}
{% endfor %}
</select>
<form action="{% url 'upload' %}">
<input type="submit" value="Add to timeline" />
</form>
<table class="timeline-table">
<tr>
<th>0-4</th>
<th>4-11</th>
<th>11-18</th>
<th>18-25</th>
</tr>
{% for tl in timeline %}
<tr>
{% if "0-4" in tl.age %}
<td>
<div class="btn-group"> <a class="btn btn-link dropdown-toggle" data-toggle="dropdown" href="#">
<h3>{{ tl.header }}</h3>
<span class="right-caret right"></span>
</a>
<ul class="dropdown-menu rightMenu">
{% for p in Pdf %}
<li>
<div class="btn-group"> <a href="{{ p.url }}" style="text-align:center;" class="btn btn-link operationsButtons">
Download pdf
</a>
</div>
</li>
{% endfor %}
</ul>
</div>
</td>
{% endif %}
</tr>
{% endfor %}
</table>
</div>
{% endblock %}
儿童型号:
class Children(models.Model):
first_name = models.CharField(max_length=100)
last_name = models.CharField(max_length=100)
age = models.CharField(max_length=100)
diagnosis = models.IntegerField(
choices= DIAGNOSIS_CHOICES,
)
disability = models.CharField(max_length=100)
parent = models.ForeignKey(User, on_delete=models.CASCADE)
解决方案
设法修复它。
不得不这样做:
意见:
def timeline(request):
timeline = Timeline.objects.all()
children = Children.objects.all()
pdfs = Pdf.objects.all()
return render(request, 'timeline.html', {
'timeline': timeline,
'children' : children,
'pdfs' :pdfs
})
页:
{% extends 'pages/home_page.html' %}
{% block content %}
<style>
.rightMenu {
position:relative;
float:right;
}
.right-caret {
border-bottom: 4px solid transparent;
border-top: 4px solid transparent;
border-left: 4px solid #000000;
display: inline-block;
height: 0;
opacity: 1;
vertical-align: top;
width: 0;
}
.right
{
float:right;
}
.thead {
font-size: 28px;
}
</style>
<div class="span4">
<h1> Timeline</h1>
<label for="child">Choose a Child:</label>
<select id="child">
{% for cl in children %}
{% if cl.parent == user %}
<option value="{{child.first_name}}">{{ cl.first_name }} {{ cl.last_name }}</option>
{% endif %}
{% endfor %}
</select>
<form action="{% url 'upload' %}">
<input type="submit" value="Add to timeline" />
</form>
<table class="timeline-table">
<tr>
<th>0-4</th>
<th>4-11</th>
<th>11-18</th>
<th>18-25</th>
</tr>
<tr>
{% for tl in timeline %}
{% if "Financial Support" in tl.header %}
<td>
<div class="btn-group"> <a class="btn btn-link dropdown-toggle" data-toggle="dropdown" href="#">
<h3>{{ tl.header }}</h3>
<span class="right-caret right"></span>
</a>
<ul class="dropdown-menu rightMenu">
{% for p in pdf %}
<li>
<div class="btn-group"> <a href="{{ p.pdf }}" style="text-align:center;" class="btn btn-link operationsButtons">
Download pdf
</a>
</div>
</li>
{% endfor %}
</ul>
</div>
</td>
{% endif %}
{% endfor %}
</tr>
<tr>
{% for tl in timeline %}
{% if "Educational Support" in tl.header %}
<td>
<div class="btn-group"> <a class="btn btn-link dropdown-toggle" data-toggle="dropdown" href="#">
<h3>{{ tl.header }}</h3>
<span class="right-caret right"></span>
</a>
<ul class="dropdown-menu rightMenu">
{% for p in pdf %}
<li>
<div class="btn-group"> <a href="{{ p.pdf }}" style="text-align:center;" class="btn btn-link operationsButtons">
Download pdf
</a>
</div>
</li>
{% endfor %}
</ul>
</div>
</td>
{% endif %}
{% endfor %}
</tr>
<tr>
{% for tl in timeline %}
{% if "Governmental Support" in tl.header %}
<td>
<div class="btn-group"> <a class="btn btn-link dropdown-toggle" data-toggle="dropdown" href="#">
<h3>{{ tl.header }}</h3>
<span class="right-caret right"></span>
</a>
<ul class="dropdown-menu rightMenu">
{% for p in pdf %}
<li>
<div class="btn-group"> <a href="{{ p.pdf }}" style="text-align:center;" class="btn btn-link operationsButtons">
Download pdf
</a>
</div>
</li>
{% endfor %}
</ul>
</div>
</td>
{% endif %}
{% endfor %}
</tr>
<tr>
{% for tl in timeline %}
{% if "Charity Support Groups" in tl.header %}
<td>
<div class="btn-group"> <a class="btn btn-link dropdown-toggle" data-toggle="dropdown" href="#">
<h3>{{ tl.header }}</h3>
<span class="right-caret right"></span>
</a>
<ul class="dropdown-menu rightMenu">
{% for p in pdf %}
<li>
<div class="btn-group"> <a href="{{ p.pdf }}" style="text-align:center;" class="btn btn-link operationsButtons">
Download pdf
</a>
</div>
</li>
{% endfor %}
</ul>
</div>
</td>
{% endif %}
{% endfor %}
</tr>
<tr>
{% for tl in timeline %}
{% if "Therapy Support" in tl.header %}
<td>
<div class="btn-group"> <a class="btn btn-link dropdown-toggle" data-toggle="dropdown" href="#">
<h3>{{ tl.header }}</h3>
<span class="right-caret right"></span>
</a>
<ul class="dropdown-menu rightMenu">
{% for p in pdf %}
<li>
<div class="btn-group"> <a href="{{ p.pdf }}" style="text-align:center;" class="btn btn-link operationsButtons">
Download pdf
</a>
</div>
</li>
{% endfor %}
</ul>
</div>
</td>
{% endif %}
{% endfor %}
</tr>
<tr>
{% for tl in timeline %}
{% if "Transport Support" in tl.header %}
<td>
<div class="btn-group"> <a class="btn btn-link dropdown-toggle" data-toggle="dropdown" href="#">
<h3>{{ tl.header }}</h3>
<span class="right-caret right"></span>
</a>
<ul class="dropdown-menu rightMenu">
{% for p in pdf %}
<li>
<div class="btn-group"> <a href="{{ p.pdf }}" style="text-align:center;" class="btn btn-link operationsButtons">
Download pdf
</a>
</div>
</li>
{% endfor %}
</ul>
</div>
</td>
{% endif %}
{% endfor %}
</tr>
</table>
</div>
{% endblock %}
有更快的方法吗?