CODEWITHSUNDEEP
javascriptjquerytwitter-bootstrap
Mudassar Khani
Mudassar Khani

Reputation: 1479

Bootstrap modal close event

I have bootstrap modal which looks something like this ; Bootstrap Modal

Following is the code for it

<!-- Buy Send Offer Success -->
<div class="modal fade custom-modal" id="make-offer-success" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" onclick="javascript:add_request()"><span aria-hidden="true"><i class="fa fa-close"></i></span></button>
            <h4 class="modal-title" id="myModalLabel"><?php echo $data['item']['brand'].' '.$data['item']['model'];?></h4>
        </div>
        <div class="modal-body">
            <div class="send-success"><i class="fa fa-check"></i> Your offer has been successfully sent</div>
        </div>
        <div class="modal-footer">
            <div class="col-md-6 btn-mrgn">
                <input type="hidden" id="item_unique_id" value="<?php echo $data['item']['item_unique_id']; ?>">
                <input type="hidden" id="buyer_id" value="<?php echo $this->session->userdata['id'] ?>">
                <button type="submit" class="btn gray-btn btn-common upercase" onclick="javascript:add_request()">Close</button>
            </div>
        </div>
    </div>
</div>

I am calling a java script function on close button and on "x" button on the modal. My problem is when user clicks anywhere on the screen Modal disappears, my function is not called and the screen stays faded.

Can anyone help to fix this problem?. How can i call my javascript function when user clicks anywhere on screen other than modal close buttons.

Upvotes: 2

Views: 10616

Answers (1)

Arun P Johny
Arun P Johny

Reputation: 388316

Instead using the hide event handler, which will be called however the modal was closed(assuming you are using modal method to hide the modal)

$('#make-offer-success').on('hide.bs.modal', function(){
    //do your stuff
})

Demo: Fiddle

Upvotes: 4

Related Questions