Python / Flask / Ajax：从客户端向服务器发送字典密钥

Question

I'm trying to figure out which image has been clicked on my page (generated with Flask) and send the id of this image to a python program with Ajax. These images are displayed by a loop like so:

_result_remote.html:

{% for key, value in resultat.vars_buttons.items() %}
    <div class="tuile{{1+loop.index%23}} news col-xs-4 col-lg-2">
        <img id ="{{key}}"style="margin-top:-5px;" src="../static/img/remote/tvb.png" width="30" >{{ value }}
    </div>
{% endfor %}

I've tried to put this script just before the {% endfor %} statement:

$(function() {
    $('img#{{key}}').on("click", function (e) {
        var id = $(this).attr("id");
    $.ajax({
        url: "/remote",
        type: "POST",
        id: id})
    });
});

and finally in my app.py:

app.py:

@app.route('/remote', methods=['POST'])
def remote():
    commande =  request['id'];
    return print(commande)

another information: my page is named _result_remote.html because it's actually an include in another page that is rendered like this:

app.py:

@app.route('/')
def accueil():
    resultat = {'module_identique' : "", "module":"", "vars": {}}
    return render_template("accueil_modulable.html", titre="Bienvenue!",resultat=resultat)

accueil_modulable.html:

<div class="row result {{ resultat.module_identique }}" id="ajax_result">
    {% for module in modules %}
        {% if resultat.module == module %}
            {% include '_result_'+ module +'.html' %}
        {% endif %}
    {% endfor %}
</div>

The include works well by the way.

Thank you very much for your help

Answer 1

If you're using Jinja 2.9 or above you can pass the context variable using with keyword.

<div class="row result {{ resultat.module_identique }}" id="ajax_result">
    {% for module in modules %}
        {% if resultat.module == module %}
            {% with resultat=resultat %}
                {% include '_result_'+ module +'.html'%}
            {% endwith %}
        {% endif %}
    {% endfor %}
</div>

For Jinja versions < 2.9 you'll have to add an extension.