How to convert JSON String to HTML Table in Flask?

Question

I am trying to convert json to html table but getting error UndefinedError: 'unicode object' has no attribute 'items'. I am getting below json from response and I am storing it into d5,

['{"pf":"K"', '"users":1', '"evennts":1}', '{"pf":"A"', '"users":7', '"evennts":7}', '{"pf":"I"', '"users":3', '"evennts":3}']

follwing is my code,

finalJson = json.dumps(d5)
    table_data = (json2html.convert(json = finalJson))
    return render_template_string('''
    <table>
            <tr>
                <td> PF </td> 
                <td> users </td>
                <td> events </td>
            </tr>

    {% for pf, users,events in table_data.items() %}

            <tr>
                <td>{{ pf }}</td> 
                <td>{{ users }}</td>
                <td>{{ events }}</td>
            </tr>
    {% endfor %}
    </table>
''', table_data=table_data)

I want to convert that json into html table like,

pf	users	events
K	1	1
I	3	3
A	7	7

Answer 1

As I have checked above, try this

        d5 = ['{"pf":"K", "users":1, "events":1},{"pf":"A", "users":7, "events":7},{"pf":"I", "users":3, "events":3}']
        # convert spark json array result to a list.
        finalJson = json.loads("[" + d5[0] + "]") 
    
        return render_template_string('''
        <style>
        table, th, td {
             border: 1px solid black;
        }
        table {
            width:80%;
            border-collapse: collapse;
        }
        td {
            text-align: center
        }
        th:first-child, td:first-child {
            text-align: left
        }
        th:last-child, td:last-child {
            text-align: right
        }
        </style>
        <table>
                <tr>
                    <th> PF </th> 
                    <th> users </th>
                    <th> events </th>
                </tr>
    
        {% for row in table_data %}
    
                <tr>
                    <td>{{ row['pf'] }}</td> 
                    <td>{{ row['users'] }}</td>
                    <td>{{ row['events'] }}</td>
                </tr>
        {% endfor %}
        </table>
    ''', table_data=finalJson)

You could also feel free to modify styles to what you want.

Answer 2

d5='[{"pf":"K","users":1,"events":1},{"pf":"A","users":7,"events":7},{"pf":"I","users":3,"events":3}]'
finalJson = json.loads(d5)

return render_template_string('''
<table>
        <tr>
            <td> PF </td> 
            <td> users </td>
            <td> events </td>
        </tr>

{% for pf, users,events in finalJson %}

        <tr>
            <td>{{ pf }}</td> 
            <td>{{ users }}</td>
            <td>{{ events }}</td>
        </tr>
{% endfor %}
</table>
''', finalJson=finalJson)

First, the string d5 should have correct json format. Second, if you want to covert string to json, you can use json.loads (not dumps)

finalJson is 'List'. So you can iterate it without items() funciton.