I didn\'t explain my problem in my last post.
So I want to add a second modal to my html page so if you click on \"Button 1\" it would open \"Modal 1\" and if you click
You only need one modal -- it's just a DIV structure, nothing magic (the only magic
is making it appear/disappear - and bootstrap does that trick). When needed, grab the desired content from where you have it stored, stick it into the modal's .modal-body
div, and let bootstrap display it.
Here's how.
(1) Store the content for each modal in hidden DIVs elsewhere in the document.
(2) Give each button an ID with a unique number you can isolate, and give each "hidden modal content div" a name ending with the same number. For example, button "#btn_2" will match with hidden div "#mdl2", which contains the content you want for button #btn_2.
(3) Use javascript (you are using Bootstrap, which uses jQuery, so why not use jQuery) to swap in the correct content. When you click the button, isolate the number 2 (var buttNum = this.id.split('_')[1];
- try it) and use that to grab the html from the #mdl2
div (var content = $('#mdl'+buttNum).html()
)
(4) Let Bootstrap take care of opening/closing the modal.
Example:
$('[id^=btn_]').click(function(){
var buttNum = this.id.split('_')[1];
//alert(buttNum);
var content = $('#mdl'+buttNum).html();
$('#myModal1 .modal-body').html(content);
});
#mdl1, #mdl2, #mdl3{display:none;} /* Hide the divs containing modal content */
Bootstrap Example
Re-Using the Same Modal
Click outside modal to close modal
Click outside modal to close modal
Image of an Animal
Click outside modal to close modal
Poem by Ogden Nash
The hands of the clock were reaching high
In an old midtown hotel;
I name no name, but its sordid fame
Is table talk in hell.
I name no name, but hell's own flame
Illumes the lobby garish,
A gilded snare just off Times Square
For the maidens of the parish.
The revolving door swept the grimy floor
Like a crinoline grotesque,
And a lowly bum from an ancient slum
Crept furtively past the desk.
His footsteps sift into the lift
As a knife in the sheath is slipped,
Stealthy and swift into the lift
As a vampire into a crypt.