John John
John John

Reputation: 1

How i can close/hide a modal popup if i click outside the modal popup

I have the following jQuery code to show a modal popup:-

$(document).ready(function () {
            
            $(function () {
                $.ajaxSetup({ cache: false });
                $(document).on('click', 'button[data-modal]', function (e) {
                    $('#myModalContent').css({ "margin": "5px", "max-height": screen.height * .82, "max-width": screen.height * .82, "overflow-y": "auto" }).load($(this).attr("data-url"), function () {
                        $('#myModal').modal({
                            height: 1000,
                            width: 2200,
                            resizable: true,
                            keyboard: true,
                            backdrop: 'static',
                            draggable: true
                        }, 'show');
                       
                    });
                    return false;
                });


            });
          });

and the following HTML:-

 <div id='myModal' class='modal fade in'>
     <div class="modal-dialog">
           <div class="modal-content">
               <div id='myModalContent'></div>
           </div>
     </div>
 </div>

currently when i click outside the modal popup the modal popup will not be hide/close.. so can i force this behavior to my jQuery modal popup ?

Upvotes: 1

Views: 52

Answers (1)

dantheman
dantheman

Reputation: 3814

You need to remove backdrop: 'static',

Upvotes: 2

Related Questions