Close Bootstrap Modal Popup inside JavaScript function

Last Reply 11 months ago By dharmendr

Posted 11 months ago

I want to close Bootstrap Modal Popup inside JavaScript function.

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

 

 

Posted 11 months ago Modified on 11 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