Close Bootstrap Modal Popup inside JavaScript function

Last Reply 9 months ago By dharmendr

Posted 9 months ago

I want to close Bootstrap Modal Popup inside JavaScript function.

<button type="button" class="close" data-dismiss="modal">&times;</button> 

 

 

Posted 9 months ago Modified on 9 months ago

Hi mukesh1,

Refer below article.

Dismiss (Close) Bootstrap Modal Popup programmatically

Check this example. Now please take its reference and correct your code.

HTML

<!-- Bootstrap -->
<script type="text/javascript" src='https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js'></script>
<script type="text/javascript" src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js'></script>
<link rel="stylesheet" href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css'
    media="screen" />
<!-- Bootstrap -->
<center>
    <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#MyPopup">
        Open Modal</button>
</center>
<!-- Modal Popup -->
<div id="MyPopup" class="modal fade" role="dialog">
    <div class="modal-dialog">
        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" onclick="CloseModal()">
                    &times;</button>
                <h4 class="modal-title">
                    Greetings
                </h4>
            </div>
            <div class="modal-body">
                Welcome to ASPSnippets.com
            </div>
            <div class="modal-footer">
                <input type="button" id="btnClosePopup" value="Close" class="btn btn-danger" onclick="CloseModal()" />
            </div>
        </div>
    </div>
</div>
<!-- Modal Popup -->
<script type="text/javascript">
    function CloseModal() {
        $("#MyPopup").modal("hide");
    }
</script>

Demo