I have common base elements of my site which I was to re-use multiple times on one page.
In one site, there will be multiple dropdowns with each having a different set of dropdowns.
Currently, I use render_template
in the following way:
from flask import render_template
@app.route('/')
def index():
return render_template('LandingPage.html',
FileName='Hi.png', relatedlist=['NewUser',"OtherNewUser"])
I am using bulma for my select form which looks like:
<div >
<select name="{{FileName|safe}}">
{% for val in relatedlist%}
<option href="#" >
{{val}}
</option>
{% endfor %}
</select>
</div>
Now, my main page looks like:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
{% include "LandingPage.html" %}
</body>
</html>
If I wanted to re-use this select list multiple times in the LandingPage.html
, how would I do that given Filename
and relatedlist
are a one-to-one mapping being pushed from my python code?
Thank you!
CodePudding user response:
I think you should create a file with macros for bulma.
For your dropdown it would look something like this.
{# macros/bulma.html -#}
{% macro select(name, values) -%}
{% set cls = kwargs.pop('class_') or kwargs.pop('class') -%}
<div {{kwargs|xmlattr}}>
<select name="{{name}}">
{% for v in values -%}
<option value="{{v}}">{{v}}</option>
{% endfor -%}
</select>
</div>
{%- endmacro %}
You can then import this file into a template and reuse the macro for various dropdowns.
{% import 'macros/bulma.html' as bulma -%}
{% for i in range(10) -%}
{{ bulma.select(filename, related_list, class_='is-primary') }}
{% endfor -%}