首页 > 解决方案 > 通过分组在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)

标签: djangodjango-modelsdjango-viewsdjango-templates

解决方案


设法修复它。

不得不这样做:

意见:

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 %}

有更快的方法吗?


推荐阅读