Using a jinja variable in JS script

Question

I'm new to Flask and looking for a way to parse one or n values of a jinja variable.

The app route hands an object over to the html template.

`selection2 = db.execute("SELECT user.id, bikes.id, bikes.name, bikeshopname, price, city, img, enddate FROM user LEFT JOIN bikes ON user.id = bikes.userid LEFT JOIN renthistory ON bikes.id = renthistory.bikeid WHERE user.city = :city AND price NOT NULL", city=select_city)
    return render_template("/bikes.html", selection2=selection2)`

In the template I implemented it like this:

{% for row in selection2 %} <p id="enddate" value="{{row["enddate"]}}"></p> {% endfor %}

In the js function I get the value (a certain date) of that particular paragraph. So it works for the first item.

function getBikeRentEndDate() {
  let enddate = (document.getElementById("enddate").innerHTML);
  document.getElementById('showdate').innerHTML = enddate;
}

But what I want is to look in all the created once the template is rendered. And then show a message if a condition is true. Something like "if date is => today - show a message.

I know there is a way but after researching and trail and erroring for quite a while, I hope someone can point it out.

All your paragraphs have the same id. Ids should be unique. You should use classes instead — Craicerjack
– Craicerjack, Commented May 29, 2020 at 15:57

Danizavtz · Accepted Answer · 2020-05-29 15:58:24Z

1

To achieve the desired result, you have to first cast the jinja2 variable to js.

To do that in your template:

<script>
    const listselection2 = JSON.parse('{{ selection2 | tojson | safe }}');
    //do your stuff with listselection2.
</script>

answered May 29, 2020 at 15:58

Danizavtz

3,3214 gold badges27 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Using a jinja variable in JS script

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related