如何创建表而不重复标题？

Question

我正在处理一个页面，如果成员符合特定条件，该页面会在表格中输出成员的信息。我遇到的问题是，如果有多个成员符合条件，则表头会不断重复自身。

这是代码

<div class="card">
      <div class="card-header bg-transparent">
         <h4>Members who list {{ instrument.name }} as their primary instrument:</h4>
      </div>

      <div class="card-body">
         {% if not primary_users %}
           <h5>There are currently no members who list {{ instrument.name }} as their primary instrument.</h5>

                    {% else %}

                        <div class="table-responsive">
                        <table class="table">
                            <thead>
                                <tr>
                                    <th>Name</th>
                                    <th>HCMN Rating</th>
                                    <th>Email</th>
                                    <th>Location</th>
                                </tr>
                            </thead>
                            {% for member in primary_users %}
                            <tbody>
                                <tr>
                                    <td><a href="{% url 'users:individual_member' member.id %}">{{ member.first_name }} {{ member.last_name }}</a></td>
                                    <td>{{ member.rating }}</td>
                                    <td>{{ member.email }}</td>
                                    <td>{{ member.area }}</td>
                                </tr>
                            </tbody>
                        </table>
                        </div>
                        {% endfor %}
                    {% endif %}
                </div>
            </div>

这是我正在谈论的问题的屏幕截图：

Answer 1

您需要将<tbody>标记移出for循环。对于</tbody>，</table>和</div>也是如此。

您只希望循环中只有<tr>...</tr>部分：

                        <tbody>

                          {% for member in primary_users %}
                            <tr>
                                <td><a href="{% url 'users:individual_member' member.id %}">{{ member.first_name }} {{ member.last_name }}</a></td>
                                <td>{{ member.rating }}</td>
                                <td>{{ member.email }}</td>
                                <td>{{ member.area }}</td>
                            </tr>
                          {% endfor %}

                        </tbody>
                    </table>
                    </div>

通常，在执行循环和条件操作时，请注意html标签，以免出现不匹配的标签。