Flask: Make row of Dataframe.to_html() clickable

Question

I have Dataframes generated automatically which shows some data. I want to link each of the rows to a route '/row_details with some of the colums sent as parameters.

@app.route('/')
def index():
    df = get_df()
    return render_template('table.html',  tables=[df.to_html(classes='data')])

@app.route('/row_details')
def row_details():
    column1 = request.args.get('column1')
    column2 = request.args.get('column2')
    #do something with those columns

I guess I could generate a new column for the dataframe consisting of the URL + GET parameters, but is there a nicer way to make the whole row clickable?

The important part of the template looks like that right now:

{% for table in tables %}
       {{ table|safe }}
{% endfor %}

I think it is the nicer way to create column with <a></a>. Other method would need internal {% for %} and {% if %} to convert every value in template - so it would be more complex. — furas
– furas, Commented Dec 21, 2019 at 18:24
in documentation to_html I found option formatters= - I never used it but maybe it could convert values in column. — furas
– furas, Commented Dec 21, 2019 at 18:27

furas · Accepted Answer · 2019-12-21 20:51:42Z

If you want to format columns separatelly - without joining values from two columns - then you can use formatters in to_html()

You had to use also escape=False if you want to put HTML in column. Normally it converts < > to > <

BTW: I had to also set 'display.max_colwidth' because it was truncating text in column.

import pandas as pd

df = pd.DataFrame({'url':[
    'https://stackoverflow.com',
    'https://httpbin.org',
    'https://toscrape.com',
]})

pd.set_option('display.max_colwidth', -1)
result = df.to_html(formatters={'url':lambda x:f'<a href="{x}">{x}</a>'}, escape=False)

print(result)

Result:

<table border="1" class="dataframe">
  <thead>
    <tr style="text-align: right;">
      <th></th>
      <th>url</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>0</th>
      <td><a href="https://stackoverflow.com">https://stackoverflow.com</a></td>
    </tr>
    <tr>
      <th>1</th>
      <td><a href="https://httpbin.org">https://httpbin.org</a></td>
    </tr>
    <tr>
      <th>2</th>
      <td><a href="https://toscrape.com">https://toscrape.com</a></td>
    </tr>
  </tbody>
</table>

But if you want to create links using values from two columns then create new column in DataFrame.

Eventually you would have to format all in template (without using to_html)

df = pd.DataFrame({
    'url':[
        'https://stackoverflow.com',
        'https://httpbin.org',
        'https://toscrape.com',
    ],
    'name':[
        'Ask question',
        'Test requests',
        'Learn scraping'
    ]
})

and

<table>
{% for row in dt.iterrows() %}
    <tr><td><a href="{{ row['url'] }}">{{ row['name'] }}</a></td></tr>
{% endfor %}
</table>

Collectives™ on Stack Overflow

Flask: Make row of Dataframe.to_html() clickable

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related