我有一个从数据库填充的位置列表。然后我使用flask和bootstrap为列表中的每次迭代显示nav-tabs。
当我遍历它时,我为列表中的每个位置动态创建一个nav-tab。然后具有特定于该选项卡的动态数据
我已经能够将这些位置作为导航标签名称。我没有看到每个标签的内容。
问:我做错了什么导致每个标签的内容都没有显示?
__ init.py __
engine = create_engine('mysql://user:passwd@ip_add/db')
insp = reflection.Inspector.from_engine(engine)
locations = []
for i in insp.get_table_names():
locations.append(str(i))
@app.route('/dashboard/')
@login_required
def dashboard():
return render_template("dashboard.html", TOPIC_DICT = TOPIC_DICT, locations=locations)
dashboard.html
{% extends "header.html" %}
{% block body %}
<div>
<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
{% for loc in locations %}
<li role="presentation"><a href="#home" aria-controls="{{ loc }}" role="tab" data-toggle="tab">{{ loc }}</a></li>
{% endfor %}
</ul>
<!-- Tab panes -->
<div class="tab-content">
{% for loc in locations %}
<div role="tabpanel" class="tab-pane fade" id="{{ loc }}">stuff for {{ loc }}</div>
{% endfor %}
</div>
</div>
{% endblock %}
浏览器查看屏幕截图
浏览器页面来源
当我查看页面来源时,我可以看到PRETORIA&#39;的内容和内容,但不会显示在页面上。
<div>
<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
<li role="presentation"><a href="#home" aria-controls="GTSP" role="tab" data-toggle="tab">GTSP</a></li>
<li role="presentation"><a href="#home" aria-controls="PRETORIA" role="tab" data-toggle="tab">PRETORIA</a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<div role="tabpanel" class="tab-pane fade" id="GTSP">stuff for GTSP</div>
<div role="tabpanel" class="tab-pane fade" id="PRETORIA">stuff for PRETORIA</div>
</div>
</div>
答案 0 :(得分:2)
错误是导航标签中的@OneToMany
List<PendingActionJobs>
链接到不正确的a href
:每个都应链接到相应标签内容的id
。
id
所以你应该在你的jinja2模板中设置<li role="presentation"><a href="#GTSP" aria-controls="GTSP" role="tab" data-toggle="tab">GTSP</a></li>
<li role="presentation"><a href="#PRETORIA" aria-controls="PRETORIA" role="tab" data-toggle="tab">PRETORIA</a></li>
这样的设置:
href
了解如何设置 <!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
{% for loc in locations %}
<li role="presentation"><a href="#{{ loc }}" aria-controls="{{ loc }}" role="tab" data-toggle="tab">{{ loc }}</a></li>
{% endfor %}
</ul>
属性:
href