I've been trying to implement a simple modal dialog in Bootstrap 2.0, but I
can't seem to get the hang of it. I'm using jQuery 1.7.1.
I've made a simplified html demo page that does nothing except for trying
to launch the modal dialog. The modal appears, but not in response to the
button click; it just appears on page load. It's styled correctly, but
doesn't have the open/close functionality that I'm expecting with the
javascript.
I've tried using data-target="#deleteConfirmation"
href="#deleteConfirmation" both alone or in combinarion. The docs imply
you can choose one or the other.
Appreciate any pointers.
thanks
<body>
<a class="btn btn-danger" data-toggle="modal"
data-target="#deleteConfirmation" href="#deleteConfirmation">Delete
Report</a>
<div class="modal" id="deleteConfirmation">
<div class="modal-header">
<a class="close" data-dismiss="modal">×</a>
<h3>
Confirm report deletion</h3>
</div>
<div class="modal-body">
<p>
Are you sure you want to delete this report? This action
cannot be undone.</p>
</div>
<div class="modal-footer">
<a href="#" class="btn btn-danger">Delete</a>
<a href="#" class="btn">Cancel</a>
</div>
</div>
<script src="jquery-1.7.1.min.js" type="text/javascript" />
<script src="bootstrap-modal.js" type="text/javascript" />
</body>
