Link to new window with customised content

Dash Python
1

Hello everyone !

I need your help !

I have a dash app with a page with a datatable about persons and some of their features. I would like to select a particular person from that datatable (done with the selected_rows option) and open a new window to display a full datatable about that particular person.
So I have prepared a page_layout with the customised datatable of that selected person (with callbacks) but I don’t know how to fill the new window with that content.

The goal is to open some pages about different people in new windows while still having the main app page open where I can access the list of all the persons.

Could you help me ? I don’t know how to fill the new pages’ content and which component (dcc.Link, html.A,…) is the best for my problem…

I would like to open the new window clicking on a button, it would be something like this :

dcc.Link(children=html.Button(children='Display the complete file of the selected person'), 
                   id='button_to_display_file',
                    href = "{}".format(person_id),
                   target="_blank",
                   style={'grid-row':'2 / 3', 'grid-column':'6 / 7'})

Have all tried many things but nothing worked as I am always directed to my main page…

Thank you very much in advance !!

2

Hey @floflo1209 ,

Have you seen this example?

https://community.plotly.com/t/link-to-an-external-site-in-a-new-browser-tab/7249

1 Like
3

Thank you for your answer !

Actually, my external link is not toward a known website.
I want to create a link to a new internal window where I can find a datatable about the selected person.

So the href of that new page would be : href="{}".format(id_selected_preson)

and the root_url + href would be the link toward a new page (which doesn’t exist) but this is my problem : I want to create that page and fill it with the datatable corresponding to the selected person (a customised layout).

Have you any idea ?

4

Hi @floflo1209

Have you considered using a a Modal component from dash-bootstrap-components library or the dash-mantine-components library?

1 Like
5

Thank you for sharing this, I didn’t know the Modal component !
However, I would like to open the selected person datatable in a new web tab keeping the main page open (in another tab) because I want to open several windows with persons content. I don’t think that it is possible with Modal as it opens a window on my main page, am I wrong ?

6

Hey @floflo1209, i have just come across a same problem. Did you manage to figure it out? Would really appreciate some guidance :slight_smile: Thanks!

Edit: I managed to get it to work, you have to define html.A (Link probably works, didn’t try it) with the href that you wish to go to. I learned that that is defined by the dash.register_page. So i registered all the used pages in app.py file with dash.register_page and all it took from there was the mentioned html.A and the correct :stuck_out_tongue: href.

    html.A(
        "Go to second page", id="second_page", href="/second-page", target="_blank"
    ),

target=“_blank” will open your second page in new tab.

1 Like
7

Thank you for your help !

Yes actually I also used dash.register_page :slight_smile: