[FIXED] Displaying nested python dictionary in html table

Issue

I have a nested python dictionary. I want to display this in a html table. I am passing the dictionary as a context variable to access it in html. However, I cannot get it to display the way I want. The way I want to display it is to have the keys as columns and then the values as the data for the rows. I have kind of got half way there:

Dictionary:

dict = {1: {'name': 'John', 'age': '27', 'height': '160'},
          2: {'name': 'Marie', 'age': '22', 'height': '170'}}

Html:

<table class="u-full-width" id="table2">
<thead >
    <tr>

    </tr>
  </thead>
 <tbody>
    {% for key,value in dict_items.items %}
    <tr>
        <th scope="row" style="text-align:center">{{ key }}</th>
        <td style="text-align:center">{{ value }}</td>
    </tr>
    {% endfor %}
</tbody>
</table>

current result

Solution

if that is Django change this line

 <td style="text-align:center">{{ value }}</td>

to

 <td style="text-align:center">{{ value.name }}</td>
 <td style="text-align:center">{{ value.age }}</td>
 <td style="text-align:center">{{ value.height }}</td>

if that helped you, please don't forget to accept this as the correct answer.

Answered By - Kevin Mukuna