✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
🐇 Announcing Dash VTK for 3d simulation graphics. Check out the March webinar.

Pass selected DataTable rows to dbc.Modal

Hi all,

Im trying to make data table in which I could select some rows and pass that value to modal after clicking button.

@app.callback(
    [Output("modal", "is_open"), Output("modal", "children")],
    [Input("open", "n_clicks"), Input("close", "n_clicks"), Input('table','derived_virtual_data'), Input('table', 'active_cell')],
    [State("modal", "is_open")],
)
def toggle_modal(n1, n2, is_open, vdata,  active_cell):
    if n1 or n2:
        #some actions of getting data from vdata using active_cell 
        #to create pandas dataframe df
        return not is_open, [
                         dbc.ModalHeader('Something in head'),
                         dbc.ModalBody(children=[
                             html.Div(
                                 dash_table.DataTable(
                                     id='table2',
                                     columns=[{"name": i, "id": i} for i in df.columns],
                                     data=(df[df['column_name'].isin([some_values])]).to_dict('records'),
                                     export_format='xlsx'
                                 )

                             ),
                            dbc.ModalFooter(dbc.Button("Close", id="close")),
                     ])]
   return is_open, [dbc.ModalHeader('nothing selected'),
                           dbc.ModalBody(children=[
                           dbc.ModalFooter(dbc.Button("Close", id="close")),
                ])] 

without derived_virtual_data and active_cell input it works as it suppose, you click button-> it opens -> click Close and it closes.
But once add inputs from data table dbc.Modal opens upon entering dashboard and totally messes up. Anyone faced similar issues? Or have any other workaround to passing data from datatable? it would be nice to use active_cells or selected_rows attributes

1 Like