How to open a small detached window?

Dash Python
1

I’m trying to have a small windows open up when clicking a button. It must be kind of like a pop up window. I saw the dash bootstrap component modal but it doesn’t quite fit my requirements. Does someone have any idea how to do this ?

2

There are a bunch of options for this but you would have to be more specific about your needs. Give one of these a go:

3

It must be like a pop up window trigerred by a button click, kind of like this one below. It must be like a new window of the navigator (not a new tab)

Capture d’écran 2024-10-30 102150
Capture d’écran 2024-10-30 1021501908×711 61.5 KB

4

If I understand you correctly you want to open a new instance of a browser in a separate window?

layout = [
    html.Button("Open Chrome in New Window", id="open-window-button"),
]

clientside_callback(
    """
    function(n_clicks) {
        if (n_clicks) {
            const width = 800;
            const height = 600;
            const left = (screen.width - width) / 2;
            const top = (screen.height - height) / 2;
            const windowFeatures = `left=${left},top=${top},width=${width},height=${height}`;
            const handle = window.open(
                "https://www.example.com/",
                "chromeWindow",
                windowFeatures,
            );
            if (!handle) {
                alert("Popup blocked! Please allow pop-ups for this site.");
            }
        }
    }
    """,
    Output("open-window-button", "n_clicks"),
    Input("open-window-button", "n_clicks"),
)
1 Like
5

Yes that’s it, thank you very much.

1 Like