title: How to structure data to easily build HTML tables in Flask
body: <p>I am trying to create HTML tables from data stored in a table. My data is read from a table and converted into a dict of lists, e.g.:</p>
  
  <pre><code>x = {'date':[u'2012-06-28', u'2012-06-29', u'2012-06-30'], 'users': [405, 368, 119]}
  </code></pre>
  
  <p>My goal is to create an HTML table with the following structure for an arbitrary list length:</p>
  
  <pre><code>&lt;table&gt;
    &lt;thead&gt;
      &lt;th&gt;Date&lt;/th&gt;
      &lt;th&gt;Users&lt;/th&gt;
    &lt;/thead&gt;
  
    &lt;tbody&gt;      
      &lt;tr&gt;
        &lt;td&gt;2012-06-28&lt;/td&gt;
        &lt;td&gt;405&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
        &lt;td&gt;2012-06-29&lt;/td&gt;
        &lt;td&gt;368&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
        &lt;td&gt;2012-06-30&lt;/td&gt;
        &lt;td&gt;119&lt;/td&gt;
      &lt;/tr&gt;
    &lt;/tbody&gt;
  &lt;/table&gt; 
  </code></pre>
  
  <p>I have tried doing this two incorrect ways in my Flask template:</p>
  
  <pre><code>&lt;tbody&gt;
    {% for line in x %}
      &lt;tr&gt;
        &lt;td&gt;{{ x.date|tojson|safe }}&lt;/td&gt;
        &lt;td&gt;{{ x.users }}&lt;/td&gt;
       &lt;/tr&gt;
     {% endfor %}
  &lt;/tbody&gt;
  </code></pre>
  
  <p>Which prints the entire list into each column.</p>
  
  <p>And:</p>
  
  <pre><code>{% for date in x.date %}
    &lt;tr&gt;&lt;td&gt;{{ date|tojson|safe }}&lt;/td&gt;&lt;/tr&gt;
  {% endfor %}
  
  {% for users in x.users %}
    &lt;tr&gt;&lt;td&gt;{{ users }}&lt;/td&gt;&lt;/tr&gt;
  {% endfor %}
  </code></pre>
  
  <p>Which simply prints everything into the first column.</p>
  
  <p>These experiments and many other dead ends lead me to believe that there is no simple way to build the table as I would like given my current data structure.</p>
  
  <p>Given this, I have two questions:<br>
  1) How would I go about building the table using my current data structure?<br>
  2) What is the standard or ideal way to structure data for this use case?</p>
  
  <p>Thanks in advance.</p>