Datatable has no data after {display:none}

Dash Python
,
1

hello everybody
in my app im using a switch to hide and show certain components using {"display:" "block"},
i have two datatables that get initialized on start, one is shown and the other one is not,
when i toggle my switch the other datatable shows up with the correct columns, but no data is shown

my switch callback

@callback(Output('range-dt', 'style'),
          Output('daily-dt', 'style'),
          Input("daily-switch", "value"),
          )
def daily_or_range(button):
    if button:
        return {"display": "block"}, {"display": "None"}
    return {"display": "None"}, {"display": "block"}

when i manually set everything to {"display:" "block"} everything works as expected
but when i use the swtich, the datatable that has {"display:" "none"} wont show any data after i trigger the switch

i also have done the same thing for graphs, and they work perfectly, i’m only having this problem on DataTables

p.n: i use a cardBody to contain the datatable, and thats where i output my “style” to

2

Hello @amoo,

Welcome to the community!

Instead of putting display block, try display initial.

3

thanks for the welcome.
unfortunately that didn’t work, BUT:
one thing i realized is if the data is inserted after my datatable has display: none, the data wont show after i change the display back to either block or initial, so i rewrote my callback to wait for the data then change its style state

@callback(
    Output('card_body_range', 'style'),
    Output('card_body_daily', 'style'),
    Input('calculated_datatable_daily', 'data'),
    Input("daily-switch", "value"),
)
def switch_for_datatable(data,button):
    # true for range
    card_body_style_day = {"display": f"{'none' if button else 'initial'}"}

    card_body_style_range = {"display": f"{'initial' if button else 'none'}"}
    if button:
        return card_body_style_range, card_body_style_day

    return card_body_style_range, card_body_style_day

and changed datatables initial display value to initial

1 Like