Opening multiple modal boxes on one page

Question

I have a page that needs to have different modal boxes open when their corresponding link on the page is clicked. I\'ve got the structure and javascript to work for ONE wind

Answer 1

The class of all modals will remain same as class="modal" but when there are numerous modals you wish to display on the same screen use the "id" property since Bootstrap Modals are written in Javascript and JS is totally based on id

You need to define which button will target which modal by using the data-target attribute of a < button > tag. In case you're using < a > tag to trigger a modal then use the href attribute. Example :

 First Modal           
 Second Modal 

OR if using < a > tag then;

 First Modal 
 First Modal 

For further information you can checkout the following page Bootstrap Modals.

Note: As per Bootstrap's official Documentation Bootstrap only supports one modal window at a time. Nested modals aren’t supported as they believe them to cause poor user experiences.