Open a modal for a each row item in table

Hi @sahanar17,

Welcome, and thanks for using Dash!

I think you can use Dash callbacks to achieve what you are looking for. Now, if by “contents of the selected item” you mean the webpage that that the URL in the html.A(href ...) points to, you’ll need an html.Iframe. You’ll want to assign an ID to the html.A so that you can use it in a callback, and then have that callback update the html.Iframe's src parameter with the href. You can put the html.Iframe in a wrapper div like a modal.

I just created an example for another community member that illustrates using a callback to open a “modal” when a button within an html.Table is clicked. Hopefully, what you want to do is similar enough to the example that it will give you a good start:

(from Adding a button inside a html.table)

Obviously, you’ll want to replace the “I popped up after you clicked that button” children of the modal-container with your html.Iframe.

PS: I took the liberty of adding formatting to your posts’ code; I hope that’s OK. It’s a lot easier to read code when it’s wrapped in

backticks

, either using ``` {code} ```, or using the WYSIWYG editor’s </> icon.