magnific popup: change content programmatically from popup form to modal spinner then back to form

Question

I need to open the first popup with a form, then after the form submission I need to show a modal popup with a spinner and after successful ajax response I need to close the modal and show the same form with either form errors or success string.

The form and spinner work on their own fine. I open the modal before sending the ajax:

var magnificForm = $.magnificPopup.instance;
var magnificSpinner = $.magnificPopup.instance;

magnificForm.open({
...
});

magnificSpinner.open({
    type: 'inline',
    items: {
        src: spinner_img,
    },
    preloader: false,
    modal: true,
});

then on response I close this one:

.done(function(response) {
    $.magnificSpinner.close();
    ...
}

But that close() also closed the first popup. How can I switch from the modal back to the form without re-initializing the whole popup?

Answer 1

Here's how to close the popup:

$.magnificPopup.close();