How do I convert a list containing OrderedDicts into a HTML table?

Question

I have a list containing several OrderedDict objects, that looks like this:

[OrderedDict([('Name', 'Soytra'), ('Class', 'First'), ('Number', '23768'), ('Place', 'NY'), ('Place1', 'LA'), ('Grade', 16.6038)]), OrderedDict([('Name', 'Reuhyta'), ('Class', 'First'), ('Number', '23769'), ('Place', 'NY'), ('Place1', 'LA'), ('Grade', 23.56789)])] 

I'd like to convert that list into the following HTML table, like below:

INFO: I have already used Pandas, would like to see some other solution

Answer 1

You don't even have to import anything! This is such a simple task that you could use lists and strings to get the same result.

All you have to do is convert the OrderedDict objects into python lists:

keys, rows = [], []
for sub_dict in ordered_items:
  row = []
  for key in sub_dict:
    if key not in keys:
      keys.append(key)
    row.append(sub_dict[key])
  rows.append(row)

Then converted those lists into a HTML table string:

thead = "<thead><tr>{}</tr></thead>".format("".join(map(lambda key: "<th>{}</th>".format(key), keys)))
tbody = "<tbody>"
for row in rows:
  tbody += "<tr>{}</tr>".format("".join(map(lambda value: "<td>{}</td>".format(value), row)))
tbody += "</tbody>"

Then when you print the concatenated strings, like this:

print("<table>" + thead + tbody + "</table>")

You should get the following result:

<table><thead><tr><th>Name</th><th>Class</th><th>Number</th><th>Place</th><th>Place1</th><th>Grade</th></tr></thead><tbody><tr><td>Soytra</td><td>First</td><td>23768</td><td>NY</td><td>LA</td><td>16.6038</td></tr><tr><td>Reuhyta</td><td>First</td><td>23769</td><td>NY</td><td>LA</td><td>23.56789</td></tr></tbody></table>

Which should output the following HTML:

 table, table * { border-collapse: collapse; } th, td { padding: 7px; text-align: left; border: 1px solid #EEE; } 

 <table><thead><tr><th>Name</th><th>Class</th><th>Number</th><th>Place</th><th>Place1</th><th>Grade</th></tr></thead><tbody><tr><td>Soytra</td><td>First</td><td>23768</td><td>NY</td><td>LA</td><td>16.6038</td></tr><tr><td>Reuhyta</td><td>First</td><td>23769</td><td>NY</td><td>LA</td><td>23.56789</td></tr></tbody></table> 

Good luck.

Answer 2

You can create your own function to create an HTML table:

from collections import OrderedDict
inDict = [OrderedDict([('Name', 'Soytra'), ('Class', 'First'), ('Number', '23768'), ('Place', 'NY'), ('Place1', 'LA'), ('Grade', 16.6038)]), OrderedDict([('Name', 'Reuhyta'), ('Class', 'First'), ('Number', '23769'), ('Place', 'NY'), ('Place1', 'LA'), ('Grade', 23.56789)])]

def makeHtmlTable(inDict):
    htmlOutput = "<table>"
    headers = [elem for elem in list(inDict[0])]
    htmlOutput += "<tr>" + "".join(["<th>" + header + "</th>" for header in headers]) + "</tr>"
    for elem in inDict:
        htmlOutput += "<tr>" + "".join(["<td>" + str(value) + "</td>" for key, value in elem.items()]) + "</tr>"
    htmlOutput += "</table>"
    return htmlOutput

print(makeHtmlTable(inDict))

Output:

<table><tr><th>Name</th><th>Class</th><th>Number</th><th>Place</th><th>Place1</th><th>Grade</th></tr><tr><td>Soytra</td><td>First</td><td>23768</td><td>NY</td><td>LA</td><td>16.6038</td></tr><tr><td>Reuhyta</td><td>First</td><td>23769</td><td>NY</td><td>LA</td><td>23.56789</td></tr></table>