-1

I want to send data to my recommend.js function from recommend.html

words_to_highlight is an array datatype

I am initializing and passing the function from main.py using FLASK

recommend.js

function highlightText(words_to_highlight) {
    console.log('button pressed');
    console.log(words_to_highlight);
}

recommend.html

<button 
    class="display-keywords" 
    onclick="highlightText({{words_to_highlight}})"
>
    Display keywords
</button>

main.py

@app.route("/recommend",methods=["POST"])
def recommend():
    words_to_highlight = [//some_data]
    .
    .
    .
    return render_template('recommend.html',words_to_highlight=words_to_highlight)

from the html file:

onclick="highlightText({{words_to_highlight}})"

this line does not send the variable words_to_highlight to my js file as the console.log() in js prints nothing to my console

Omega
  • 63
  • 1
  • 6
  • 1
    onclick="highlightText({{words_to_highlight}}) so this line of code is not passing your words to highlight variable to your JavaScript file? – Winmari Manzano Apr 25 '22 at 10:31
  • @WinmariManzano correct, it's not sending the variable to my js file – Omega Apr 25 '22 at 10:34
  • 1
    https://stackoverflow.com/questions/15321431/how-to-pass-a-list-from-python-by-jinja2-to-javascript this post have good answers especially the {{ your_variable | tojson }} – Winmari Manzano Apr 25 '22 at 10:44

1 Answers1

1

You only need to make few corrections

function clickHandler(data){
  console.log(data) //This will log the data from html button
}
<button onclick="clickHandler('This is the data I want to pass')">click me</button>

applying that to your question now:

function highlightText(words_to_highlight) {
    console.log('button pressed');
    console.log(words_to_highlight);
}
<button 
    class="display-keywords" 
    onclick="highlightText('{{words_to_highlight}}')"
>
    Display keywords
</button>

Note, if the data you want to pass is not a string you need to pass it to the data type in your javascript.

Blessing Ladejobi
  • 169
  • 3