Magnific Popup Callback when closing

Question

I am using Magnific Popup for uploading images. When the user clicks or presses the close button, I'd like to get confirmation from the user whether to close on not.

This is my Javascript:

$('#upload').magnificPopup({
    type:'inline',
    callbacks: {
        close: function(){
            if( confirm("Are you sure you want to close?") ) {
              return true;
            }
              return false;
            }
          }
      }
});

But it is not working.

score 11 · Answer 1 · answered Jun 27 '14 at 17:57

You can override the close method. By modifying the instance, you will only change the functionality of this specific popup. Then simply call the original close method to finish the job.

$('#upload').magnificPopup({
  type:'inline',
  callbacks: {
    open: function() {
      $.magnificPopup.instance.close = function() {
        // Do whatever else you need to do here
        var confirmed = confirm("Are you sure you want to close?");
        if(!confirmed) {
          return;
        }

        // Call the original close method to close the popup
        $.magnificPopup.proto.close.call(this);
      };
    }
  }
});

score 3 · Answer 2 · edited Sep 30 '20 at 17:53

3

You could try:

( '#upload' ).magnificPopup({
    type: 'inline',
    callbacks: {
      close: function(){
         var didConfirm = confirm( "Are you sure?" );
         if( didConfirm == false ){
            return false;
         }
      }
    }
});

edited Sep 30 '20 at 17:53

prosoitos

6,679
5
27
41

answered Jun 14 '13 at 05:38

CodeHunter

378
1
3
16

2

Thanks. you compressed my question. Not Working – KKK Jun 14 '13 at 05:49
@Mifas i think the real problem is wid returning the value ,why do u want top retun the value of confirmbox?,its just diverting the original flow of the close function – CodeHunter Jun 14 '13 at 05:55
@Mifas i think it will work now (its already working with me) – CodeHunter Jun 14 '13 at 05:59
1

@CodeHunter I've created a demo based on your answer. Please check if its working or not http://jsfiddle.net/K9Geq/ – KKK Jun 14 '13 at 06:14
1

I found @CodeHunter's answer to work fine for my needs. – Ryre Feb 12 '14 at 03:52
1

I 2nd @Toast, Works fine for me too! I overlooked the need to create a callback object but thats the trick! – R. Mo Nov 25 '14 at 18:13
This is for sure the better way – raythurnevoid Aug 25 '17 at 09:08

Magnific Popup Callback when closing

2 Answers2