如何通过javascript / jquery函数调用bootstrap上的modal

Question

I was having a problem on calling bootstrap modal on a simple button or link maybe because its having a conflict with my select2 plugin (which I'm not really sure of) ,by the way I did just append the button to the select2 drop down, here is my javascript that wont work:

 $(".select2-drop").append('<table><tr><td><button class="btn" data-toggle="modal" data-target="#ModalAdd">New Supplier</button></td></tr></table>');`

because of this I'm just trying to do a javascript/jquery function to open the modal ( dont know if its the best way.)

here is my javascript code:

$(".select2-drop").append('<table><tr><td><button class="btn" onClick="modal() ">New Supplier</button></td></tr></table>');

tried to alert some message on it and it worked:

function modal(){
   alert("pressed");
}

My question is, How can I call modal on bootstrap via javascript/jquery function?

any kind of help/suggestions would really be appreciated, Thank you and have a good Day!

Answer 1

Try this

$('#modalID').modal('show')

By HTML

<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#yourmodalid">
    Launch modal
</button>

Answer 2

If you want it completely "mechanical" see this example :

fiddle -> http://jsfiddle.net/RvJV8/

$("#btnOpen").click(function() {
    $("#myModal").modal();
});

---

Did you ever tried this? It works ..

$(".select2-drop").append('<table><tr><td><button class="btn" onclick="$(&quot;#myModal&quot;).modal();">New Supplier</button></td></tr></table>');

forked fiddle -> http://jsfiddle.net/3uZAZ/