0

I am trying to make functioning bootstrap model, but it does not work.Not able to find what I am missing. jsfiddle: jsFiddle link here

<div id="modal-3" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">Modal header</h3>
</div>
<div class="modal-body">
    <p>One fine body…</p>
</div>
<div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">No</button>
    <button class="btn btn-primary" data-dismiss="modal">Yes</button>
</div>


<a href="#modal-3" role="button" class="btn" data-toggle="modal">Confirm</a>
ABC
  • 4,263
  • 10
  • 45
  • 72

2 Answers2

2

Remove the hide class on the modal container. It is redundant with the modal itself. Working example:

<div id="modal-3" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> ...

kaliatech
  • 17,579
  • 5
  • 72
  • 84
  • Please have a look to my related problem...http://stackoverflow.com/questions/20872959/show-twitter-bootstrap-model-on-form-submit – ABC Jan 01 '14 at 20:34
0

You are missing, bootstrap.min.js or bootstrap modal.js , don't forget to initiate.

add $('#myModal').modal(); or $('#myModal').modal({ options }); at the bottom of your script.

more about bootstrap modal APIs

VenomVendor
  • 15,064
  • 13
  • 65
  • 96