bootstrap: Escape key not working on a modal
I’ve implemented Twitter-Bootstrap in my open source Project Visual Alchemist. TwBs its an awesome framework, thanks a lot! However, the escape key works in all my dialogs, except the last one which contains a pre tag. This dialog is shown on the Generate Models button. Here is the HTML partial for it:
<div id="resultsDialog" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title">Copy below code and run to generate models<span id="databaseName"></span></h4>
</div>
<div id="theCode" class="modal-body form-inline">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<script type="text/javascript">
//$("#fieldName").focus();
//document.getElementById("fieldName").focus();
//console.log("Focussed");
</script>
About this issue
- Original URL
- State: closed
- Created 9 years ago
- Comments: 16 (6 by maintainers)
@kkirsche When I compared my html with the canonical example, I found that my main dialog block (
div.modal) lacked this attribute:I found that once I added that attribute, the escape key started working in the fiddle as well as my original code! Are we always supposed to add this attribute? If so, I’m sorry this may not be a bug, but a configuration mistake?