bootstrap show two modals - workaround

by hhcofcmds

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/2.3.2/css/bootstrap.min.css">
<script src="https://ao-docs-staging.appspot.com/js/jquery-ui-1.10.3.custom.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/2.3.2/js/bootstrap.js"></script>
        <button id="open">open</button>

<div id="modal1" class="modal fade">
    <div class="modal-body">
        hello world1
    </div>
</div>
<div id="modal2" class="modal fade">
    <div class="modal-body">
        hello world2
    </div>
</div>

JavaScript

$.fn.modal.Constructor.prototype.enforceFocus = function () {};
var modal1 = $("#modal1");
var modal2 = $("#modal2");
var showBoth = function(){
    modal2.modal('show');
	modal1.modal('show');
}
$("#open").click(showBoth);
showBoth();