title: Pass Flask variable into Javascript
body: <p>I'm have a Flask website with a OpenLayers (javascript) web map. I'm trying to lookup an address to lat and lon coordinates, and then have the map render itself at that location.</p>
  
  <p>So at it's most basic, I'm trying to pass the result of an Flask sql query into some javascript, and then action that javascript.</p>
  
  <p>Let's forget about rendering the map, and just try to get the lat/lon output displaying in javascript on the webpage</p>
  
  <p>I get the coordinates as an array with Python:</p>
  
  <pre><code>def lookUpPostcode(postcode):
      latLon = [0,0]
      cur.execute("SELECT * from PostCodeToBNG WHERE postcode = %s limit 1",(postcode,))
      for x in cur.fetchall() :
              lat = x[2]
              lon = x[3]
              latLon = [lat,lon]
      return latLon
  </code></pre>
  
  <p>And pass them to the Flask webpage in this HTML</p>
  
  <pre><code>{% if latLon %}
  &lt;p class="value"&gt;&lt;strong&gt;Value:&lt;/strong&gt; {{ latLon }}
  </code></pre>
  
  <p>This all works fine, the latLon render in the Flask output...but then how do I pass them to this little javascript snippet? Right now I just get 'undefined'.</p>
  
  <pre><code>&lt;script&gt;
  var latLon = latLon;
  document.getElementById("demo").innerHTML = latLon;
  &lt;/script&gt;  
  {% endif %}
  </code></pre>
  
  <p>If I instead do</p>
  
  <pre><code>var latLon = 'this is latLon'
  </code></pre>
  
  <p>Then that string outputs fine - but I want it to dynamically change.</p>
  
  <p>Thanks in advance</p>