I ran across this very nice jQuery/bootstrap modal plugin:
http://nikku.github.com/jquery-bootstrap-scripting/
However, in trying to get the simplest example to work, I ran into an issue
My dialog, copied from their site, is being displayed when the page first loads.
Html:
<a class="open-dialog" rel="sample1-dialog">trigger</a>
<div id="sample1-dialog" style="display: none">
<h1>Simple alert</h1>
<p>
It is always beneficial to acknowledge alerts of any kind.
You can close this alert if you agree.
(Note: Normally a dialog box is not that penetrating)
</p>
<div class="form-actions">
<button class="btn-primary close-dialog">Understood</button>
<button class="btn-danger" onclick="alert('You might reconsider your click behaviour!')">I don't care</button>
</div>
</div>
jQuery:
$(function () {
$("#sample1-dialog").dialog2({
showCloseHandle: false,
removeOnClose: false,
autoOpen: false,
closeOnEscape: true,
closeOnOverlayClick: true
});
$(".open-dialog").click(function (event) {
event.preventDefault();
$("#sample1-dialog").dialog2("open");
});
Here's a fiddle that shows the issue:
I can't believe that this is a problem with their code. Their samples work fine.
Am I missing something obvious?