我正在使用模型表单,并且我在模板中呈现了该表单,如下所示。
<table>
{{form.as_table}}
</table>
但问题是,它将所有字段呈现为行。由于我的模型包含超过 200 行,当它显示元素为 200 行时,它看起来很糟糕。我想将它们分成 5 列,所以总行数将在 40-43 左右。是否有任何内置模板标签可用于此或我们可以解决问题的任何其他方式。
我正在使用模型表单,并且我在模板中呈现了该表单,如下所示。
<table>
{{form.as_table}}
</table>
但问题是,它将所有字段呈现为行。由于我的模型包含超过 200 行,当它显示元素为 200 行时,它看起来很糟糕。我想将它们分成 5 列,所以总行数将在 40-43 左右。是否有任何内置模板标签可用于此或我们可以解决问题的任何其他方式。
你可以参考这个文档:looping over form fields
您可以在模板中执行的操作是
{% for field in form %}
{%if forloop.counter|divisibleby:"5" %}
{#after 5 fields, somehow put elements in next row
of table, paragraph, or using divs etc
#}
{%endif%}
{{field}}
{%endfor%}
你的问题有点不清楚,但是这个例子绰绰有余。
循环遍历一个列表data
,我已经替换了它,以便它可以显示column1,column2,column3,column4,column5
在每一行中,例如。
<!DOCTYPE html>
<html>
<head>
<title>Jack of All Trades</title>
</head>
<body>
<table border="1">
{% for element in data %}
<tr>
<td><p>column 1 </p></td>
<td><p>column 2 </p></td>
<td><p>column 3 </p></td>
<td><p>column 4 </p></td>
<td><p>column 5 </p></td>
</tr>
{% endfor %}
</tr>
</table>
</body>
</html>
假设data
有 5 个元素,它将产生如下内容:
这对我来说效果更好(除以:n,n = 列数):
<form enctype="multipart/form-data" method="POST">
{% csrf_token %}
{% for field in form %}
{{ field.label }} {{ field }}
{% if forloop.counter|divisibleby:"2" %}
<br>
{% endif %}
{% endfor %}
<input type="submit" value="Continue" />
</form>
<form method="POST">
{% csrf_token %}
<table>
{% for field in form %}
<tr>
<td>{{ field.label}}</td>
<td>{{ field }}</td>
</tr>
{% endfor %}
</table>
<button type="submit" class="btn btn-primary">Submit</button>
我使用引导程序 4,表单标签名称是“employee_in”。两列中的每一列都有 6 个输入字段(已修复,还有其他人知道如何使其自动化吗?)到目前为止我能做到的最好,希望对您有所帮助
<form enctype="multipart/form-data" method="post">
{% csrf_token %}
<div class="container-fluid">
<div class="row">
<div class="col-lg-6">
<table class = 'table table-hover'>
{% for my_divider in employee_in %}
{% if forloop.counter <= 6 %}
<tr>
<td>{{ my_divider.label }}</td>
<td>{{ my_divider }}</td>
</tr>
{% endif %}
{% endfor %}
</table>
</div>
<div class="col-lg-6">
<table class = 'table table-hover'>
{% for my_divider in employee_in %}
{% if forloop.counter > 6 %}
<tr>
<td>{{ my_divider.label }}</td>
<td>{{my_divider}}</td>
</tr>
{% endif %}
{% endfor %}
</table>
</div>
</div>
<input type="submit" class = 'btn btn-secondary' value="Submit">
</div>
</form>