Dynamic nav-bar elements – passed from Flask to Jinja – inherited layout template

Question

Environment: Python 3.6, Flask 1.02, Jinja2

Objective:

Create a dynamic menu in layout.html (which is extended by content.html)
yet the url_for of the dynamic element is frequently requires a parameter to be passed

Issue statement:
How can I pass the parameters for url_for in Jinja template when rendering the template?

I feel like I would need the syntax of str().format in Jinja..

I tried to:

1. pass each part as a separate value:

menus = [{'url': 'func_name', 'menu_title': 'title', 'param': 'param_name', 'param_val': 'param_value'}] 
return render_template('content1.html', menus=menus]

in jinja I tried to call it like: (I also tried it without the plus and double-quotes)

{{ url_for(func_name), param_name+ "=" + param_val }}

During rendering it gives error of
url_for() takes 1 positional argument but 2 were given

2. tried to use the {% set var_name: passed_variable %}

Built on 1st version of menus defined on server side, I tried to set the variables within Jinja, but also failed.

menus = [{'url': 'func_name', 'menu_title': 'title', 'param': 'param_name', 'param_val': 'param_value'}] 
    return render_template('content1.html', menus=menus]

Jinja

{% for menu in menus %}
{% set url = menu.get('url') %}
{% set param = menu.get('param') %}
{% set value = menu.get('param_val') %}
{% url_for(url, param + "=" + value %}

Yet it also didn’t work.
It feels like if I give a param for the url_for syntax (not a hard-wired string) I cannot add the parameters.

3. tried to pass whole content of url_for as a string:

menus={'url_string': " 'func_name', param_name=param_value"}

yet it fails again as url_for syntacs put the whole between apostrophes, which I wouldn’t need at the end.

Some references I scanned through.
Flask context-processor

It could work if I would create another template of each nav-bar for each content page – yet with that move i could simply move the navbar into the content page. However that seems dull. Stack Overflow topic

Thus question:
How can I pass the

param_id=paramval['id']

for the url_for syntax during rendering

{{ url_for('edit_question', param_id=paramval['id']) }}

The code/structure stg like below:
layout.html

<html>
<body>
    {% for menu in menus %}
        {% for key, value in menu.items() %}
            <a href="{{ url_for(value) }}" >
                {{ key }}
            </a>
        {% endfor %}
    {% endfor %}
{% block content %}

{% endblock %}
</body>
</html>

content1.html

{% extends 'layout.html' %}
{% block content %}
 content
{% endblock %}

content2.html

{% extends 'layout.html' %}
{% block content %}
 content
{% endblock %}

app.py

@app.route('/')
def index():
    menus = [{'menu_title1': 'menu_func_name1'}]
    return render_template('content1.html', menus=menus)

@app.route('/menu_details/<int:menu_nr>')
def show_details_of_menu(menu_nr):
    menus = [{'menu_title3': 'menu_func_name3', 'menu_param_name': 'menu_param_value'} 
    return render_template('content2.html', menus=menus)

sorry for the Wall of text..

Asked By: Neophyte

||

Source

Answer 1

sigh.. after hours I just found how to construct the syntax. I hope it will help others!

During rendering:

menus = [{'url': 'func_name', 'menu_title': 'title', 'parameters': {'param1': param1_value}}]
return render_template('context.html', menus=menus]

In Jinja, I adjusted the syntax to manage cases where no parameters are needed:

            {% for menu in menus %}
                {% if menu.get('parameters').items()|length > 0 %}
                    <a href="{{ url_for(menu.get('url'), **menu.get('parameters')) }}">
                        {{ menu.get('menu_title') }}
                    </a>
                {% else %}
                    <a href="{{ url_for(menu.get('url')) }}">
                        {{ menu.get('menu_title') }}
                    </a>
                {% endif %}
            {% endfor %}

Answered By: Neophyte

Dynamic nav-bar elements – passed from Flask to Jinja – inherited layout template

Question:

Answers: