Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Magnific Popup action before close

I have implemented Magnific Popup in my solutions and I am using Bootbox to get confirmation from the user that he wants to close the window without saving changes, etc.

I hooked up my custom function to close callback but it doesn't work as expected.

$('#divThumbnails').magnificPopup({
            delegate: 'a',
            type: 'inline',
            midClick: true,
            callbacks: {
                close: function () {
                    var confirm = bootbox.confirm('Are you sure?', function(result) {
                    });

                    if (confirm)
                        return true;
                    else
                        return false;

                }
            }
        });

This is just a fast sample, not production code. The if-else statement is there because otherwise Bootbox dialog fails to show (normally there is no need to check the returned value as it is passed as argument which in this example is called result ).

The problem is that after I click the close button my image (which is the content of the popup) disappears. I would like to have an opportunity to cancel the close operation and to achieve that I need an event that will fire BEFORE closing the popup.

Is this possible to achieve with Magnific Popup ?

like image 335
Tobiasz Avatar asked Jun 21 '13 11:06

Tobiasz


1 Answers

  // this part overrides "close" method in MagnificPopup object
  $.magnificPopup.instance.close = function () {

      if (!confirm("Are you sure?")) {
          return;
      }

       // "proto" variable holds MagnificPopup class prototype
       // The above change that we did to instance is not applied to the prototype, 
       // which allows us to call parent method:
       $.magnificPopup.proto.close.call(this);
  }; 

http://codepen.io/dimsemenov/pen/edCgo

like image 137
Dmitry Semenov Avatar answered Oct 14 '22 16:10

Dmitry Semenov