Dynamically loop python list in Javascript

Question

I'm facing the issue when passing list from Python to Javascript. I need to loop the python list in javascript to get each element of the list. So, could you please help me out with how to dynamically loop the list to get all the values from the df or is there any other way to achieve it.

Below is the code: .PY file:

df = pd.read_csv('os.csv')
df = df.fillna('-')
df = df.values.tolist()
return render_template('pdf_test.html',df = df)

python output: df = [['OS Version', 'Red Hat Enterprise Linux Server 7.6 (Maipo)'], ['OS Kernel Version', '3.10.0-957.97.1.el7.x86_64']]

Javascript

<script type="text/javascript">
    function saveDiv() 
    {
        var df1 = '{{df[0]}}'; //it returns first index of the list.How to dynamically loop the list to get all the values from the df.
    }
</script>

Lost Stranger · Accepted Answer · 2022-10-18 03:03:52Z

0

Sorry, not enough reputation for comment, hence posting as answer.

When you pass List to JS code, you need to print it out as encoded, usually in PHP we do with json_encode,

I looked for the similar and found for python as well.

 json.dumps({'apple': 'cat', 'banana':'dog', 'pear':'fish'})

'{"pear": "fish", "apple": "cat", "banana": "dog"}'

I think with this you can print your JSON, and JS will recognize it as Array. Further you can perform JS operations.

Source: https://stackoverflow.com/a/983879/20164098

answered Oct 18, 2022 at 3:03

Lost Stranger

865 bronze badges

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

Comments

yuxiang meng · Accepted Answer · 2022-10-18 03:12:51Z

0

Can you get DOM in JavaScript?
If you could, just generate a string with df and insert the dom.
For example: if there's a dom in your HTML:

<div id='listBlock'></div>

generate dom string with javascript:

const domString = df.map(i => `<div class='list-item'>${i}</div>`)
const listDom = document.getElementById('listBlock')
listDom.appendChild(domString)

answered Oct 18, 2022 at 3:12

yuxiang meng

263 bronze badges

Collectives™ on Stack Overflow

Dynamically loop python list in Javascript

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related