Display data after uploading


My app takes an csv as one of the input, the users can drag, drop or select flie. I want to show the user a sample of the data after upload, in a pop-up window (or confirmation window). Is there any way to do that?


For a popup window use dbc.Modal from https://dash-bootstrap-components.opensource.faculty.ai/l/components/modal

When the data loads, return the top 10 rows of the data to a table inside a modal with some kind of confirmation dialog.

I don’t have the pop-up windows using dbc.Modal

Here is my code using dash_bootstrap_components version 0.6.3 (I need to use that because I’m using Dash 0.42.0, and the migration to dash 1.x.x is not yet planned)

import dash
import dash_bootstrap_components as dbc
from dash.dependencies import Input, Output, State
import dash_html_components as html

app = dash.Dash(
    __name__, meta_tags=[{"name": "viewport", "content": "width=device-width"}]
server = app.server

# Create app layout
app.layout = html.Div(
                dbc.Button("Open modal", id="open"),
                        dbc.ModalBody("This is the content of the modal"),
                            dbc.Button("Close", id="close", className="ml-auto")
    style={"display": "flex", "flex-direction": "column"},

    Output("modal", "is_open"),
    [Input("open", "n_clicks"), Input("close", "n_clicks")],
    [State("modal", "is_open")],
def toggle_modal(n1, n2, is_open):
    if n1 or n2:
        return not is_open
    return is_open

# Main
if __name__ == "__main__":
    app.run_server(debug=True, host='', port=8050)


Make sure you add dbc.themes.BOOTSTRAP to external_stylesheets