Anis Souames Anis Souames - 5 months ago 17
HTML Question

JQuery Dialog with dynamic divs

I'm building a web app, where in one page I have 6 divs that are generated dynamically, each div contain a hidden child div and a button, I want when the user click on the button of a given div, a dialog appears with the child of that div as a content .

Here's an MCVE on JS Fiddle (run the snippet to see the actual code) to help you understand (My code is very large and I can't share it for privacy reasons so I recreated the problem I'm facing .) :

<iframe width="100%" height="300" src="//" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

Here's the link too if you want :

The problem as you can see i sthat when clicking on the first button it shows 4 dialogs of the 4 divs from the last one to the firts one .

I want to be able to make each button returns it's given div only . There's also another problem : when I close all dialogs and reclick on the first button nothing appears, why ?

Thank's for your time


First problem. You have same ids for all buttons.

button id = "showMovieInfo2"

Second you have problem with dialog. You need to set ids for each dialog in order to work.

here is complete example

Hope this helps.