twitter-bootstrap-modal

Demostrating issues #143 and #144 in bootstrap-select.

by Valerie Ren

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap.css">
<script src="http://silviomoreto.github.io/bootstrap-select/javascripts/bootstrap-select.js"></script>
<link rel="stylesheet" href="http://silviomoreto.github.io/bootstrap-select/stylesheets/bootstrap-select.css">
    <div class="container">

        <h3>Modal Example</h3>

        <!-- Button to trigger modal -->
        <div>
            <form id="random_shit" action="/asd" >
                <input type="submit" />
            </form>
        </div>

        <!-- Modal -->
        <div id="mymodal1" class="modal fade bs-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content" id="dialog-download">
            <br/><br/><h2>Your Download is ready.</h2>
            <hr/>
             Your Download link is here<a id="download_link" target="_blank"> </a>
            <br/>
        </div>
     </div>
</div>

CSS

.btn-group {
    z-index: 1051;
}

JavaScript

$("#random_shit").submit(function(e){
    e.preventDefault();
    $("#mymodal1").modal("show");
    // get value from ajax call here, update html and href in form.
    $("#download_link").html("www.google.com");
    $("#download_link").attr("href", "www.google.com");
    return false;
});
//$(document).on('focusin.modal', '[data-toggle=dropdown], [role=menu]', function (e) { e.stopPropagation() });