【问题标题】:Issue rendering with nested tables in Django在 Django 中使用嵌套表渲染问题
【发布时间】:2018-04-19 03:28:08
【问题描述】:

我正在尝试将两个表相互循环。我有一个任务列表,每个任务都有一个材料列表。我想把桌子放在一起。但是,下面的代码不会将第二个任务呈现为列。因此,当它循环时,似乎表结构被破坏了。我正在使用 Django/Python。

<div class="table-responsive">
    <table id="taskTable" class="table">
        {% for task in projecttype.projecttask_set.all %}
            <h5>Task - {{ task.name }}</h5>
            <thead class="alert-success">
            <tr>
                <th>Quantity</th>
                <th>Units</th>
                <th>Cost</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>{{ total_units_required }}</td>
                <td>{{ task.base_unit_label }}</td>
                <td>{{ task.base_unit_cost }}</td>
            </tr>
            </tbody>
            <table id="materialTable" class="table">
            <thead>
            <tr class="alert-info">
                <th>Material</th>
                <th>Cost per Task Unit</th>
                <th>Material Cost</th>
                <th>Total Cost</th>
            </tr>
            </thead>
            {% for material in task.materials.all %}
                <tbody>
                <tr>
                    <td>{{ material.name }}</td>
                    <td>{{ material_quantity_per_task_base_unit }}</td>
                    <td>{{ total_material_quantity }}</td>
                    <td>{{ total_material_cost }}</td>
                </tr>
                </tbody>
            {% endfor %}
            </table>
        {% endfor %}
    </table>
</div>

【问题讨论】:

  • HTML 表格不应包含多个(或嵌套的)tbody 和thead 元素。检查呈现的原始 html 以查看它的外观。
  • 感谢您的回复。我改变了我们这样做的方式。

标签: python html django html-table datatables


【解决方案1】:

我遇到了同样的问题。嵌套表格必须在表格单元格内

例如

<table>
    <tr>
    <td>
        <table>
        ...
        </table>
    </td>
    </tr>
</table>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-07-11
    • 2017-04-27
    • 1970-01-01
    • 1970-01-01
    • 2014-03-15
    相关资源
    最近更新 更多