Dash interactive table

Dash Python
1

Hello all,
I am looking for a way to create an interactive table, the main idea is to place a column in which action buttons (row selection or drop-down menus) will be located.
Also, is it possible to make dropdown tables below the row of the main table?
Is it possible to implement it?

2

Hi @dilfin07

See if this solution could be for your needs:

3

Hi @Eduardo
I’m very glad to hear from you, yes, this solution looks very interesting,
So, maybe you can help, I am trying to create an interactive table having the following structure for a row

html.Div(
    html.Table(
        html.Tbody(
            html.Tr([
                html.Td(html.Div(html.Button('+', id="show"))),
                html.Td('1'),
                html.Td('2')
            ])
        ))    
            ),
            html.Div(html.Table(id='click_res'))

accordingly, so that a row in the main table looks something like this, and when you click on the button, a table under the selected row is formed using the same sausage,

is it possible to implement something like this?

image
image1206×290 14 KB

4

@dilfin07

I’m not familiar using 'html.Td’

I use ‘dash_table.DataTable’ and Pandas DataFrame

Then using the example I linked, you can listen what option the user selects, then with a callback you can filter your DataFrame to show the second table.

5

@Eduardo
but can i display the second table with calabs between the rows of the first one?

as an option, rewrite df by inserting the rows of the second table between the rows of the first, how much is it correct?

6

No, I think it’s not possible using dash_table.DataTable.
Perhaps it’s possible using html.Tr and html.Td but I can’t help on that. :woozy_face: