javascript for-loop not iterating within python loop

Question

I have a list of dates in python that I would like to iterate through to create button elements.

df2 = ['Sat Nov 12 11:57:21 CST 2022',
 'Wed Nov 23 18:13:31 CST 2022',
 'Wed Nov 23 18:13:32 CST 2022',
 'Thu Nov 10 19:07:50 CST 2022',
 'Fri Nov 11 09:54:54 CST 2022',
 'Fri Nov 11 10:18:36 CST 2022',
 'Sat Nov 26 10:50:05 CST 2022',
 'Sat Nov 12 11:57:50 CST 2022']

For some reason my javascript loop doesn't iterate the value yet outside the js loop it is iterating the value

for count, value in enumerate(df2):
    counts = str(count)
    f.write(''' 
            <html>
               <head> 
                  <meta name="viewport" content="width=device-width, initial-scale=1"> 
               </head> 
               <body> 
                  <div id="myHTMLWrapper"> 
                  '''+value+'''
                  </div>
                  <script>
              var wrapper = document.getElementById("myHTMLWrapper");
              var myHTML = '';
              for (var i = 0; i < '''+counts+'''; i++) {
                myHTML += '<button class="test">'''+value+'''</button>';
              }/*  w w  w  . j av a  2  s. c o  m*/
              wrapper.innerHTML = myHTML

                  </script>  
               </body>
            </html>
            ''')

So the value variable in my div there is iterating fine. The buttons are also being generated but they have the last value of my list still...

If the problem is with the javascript, then show us the actual final javascript. — John Gordon
– John Gordon, Commented Dec 1, 2022 at 20:07
Why are you rendering anything with JavaScript if you're generating the HTML with Python, anyway? Also, should you really have an entire <html> for every member of df2? — BrownieInMotion
– BrownieInMotion, Commented Dec 1, 2022 at 20:09

Tim Roberts · Accepted Answer · 2022-12-01 20:12:41Z

2

If you're dfoing the looping in Python, as you are doing here, then you don't need to do any looping in Javascript. The HTML you create will already have all of the data enumerated:

df2 = ['Sat Nov 12 11:57:21 CST 2022',
 'Wed Nov 23 18:13:31 CST 2022',
 'Wed Nov 23 18:13:32 CST 2022',
 'Thu Nov 10 19:07:50 CST 2022',
 'Fri Nov 11 09:54:54 CST 2022',
 'Fri Nov 11 10:18:36 CST 2022',
 'Sat Nov 26 10:50:05 CST 2022',
 'Sat Nov 12 11:57:50 CST 2022']



f.write(''' 
        <html>
           <head> 
              <meta name="viewport" content="width=device-width, initial-scale=1"> 
           </head> 
           <body> 
''')

for count, value in enumerate(df2):
    f.write(''' 
              <div id="myHTMLWrapper"> '''+value+''' </div>
              '<button class="test">'''+value+'''</button>';
            ''')

f.write('''
   </body>
</html>
''')

answered Dec 1, 2022 at 20:12

Tim Roberts

55.3k4 gold badges28 silver badges41 bronze badges

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

5 Comments

Cpt.Hook Over a year ago

You should give the div an unique ID, too. E.g. using id="myHTMLWrapper'''count'''"

pdangelo4 Over a year ago

This was great, just formatting wise I have the generated buttons stacked now instead of side by side which my js generated.

Tim Roberts Over a year ago

Then perhaps you want the <div> to be outside of the loop and containing the buttons, instead of inside.

pdangelo4 Over a year ago

@Tim, so essentially var js_list = str(df2) to move my list to JS and perform the function within <script> ?

Tim Roberts Over a year ago

If you want to defer the real work to the Javascript, yes, that could be done. I'd just as soon do it in the Python, but that's personal preference.

Collectives™ on Stack Overflow

javascript for-loop not iterating within python loop

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related