I want to open my popup when ajaxCall function is called.

Like this:

function ajaxCall()
{

 openPopup();

}

function openPopup()
{

$('.popup-modal').magnificPopup({

type: 'inline',
modal: false,

});

$(document).on('click', '.closePopup', function (e) 
            {
                e.preventDefault();
                $.magnificPopup.close();
            });

}

Here is the fiddle: /

I want this popup to open when ajaxCall function is called.

Here is the working fiddle for onclick button open popup:

/

I want to open my popup when ajaxCall function is called.

Like this:

function ajaxCall()
{

 openPopup();

}

function openPopup()
{

$('.popup-modal').magnificPopup({

type: 'inline',
modal: false,

});

$(document).on('click', '.closePopup', function (e) 
            {
                e.preventDefault();
                $.magnificPopup.close();
            });

}

Here is the fiddle: http://jsfiddle/qweWa/33/

I want this popup to open when ajaxCall function is called.

Here is the working fiddle for onclick button open popup:

http://jsfiddle/qweWa/27/

• javascript
• jquery
• popup
• magnific-popup

• $.magnificPopup is not a function -->error ! please rectify – Dimag Kharab Commented Feb 21, 2014 at 7:39
• Please check my post now. I have added a working fiddle which works on onclick button – Hassan Sardar Commented Feb 21, 2014 at 7:45
• and your ajax function? – Jai Commented Feb 21, 2014 at 7:49
• No need of ajax function here. I just want this popup to be opened when ajaxCall function is called. – Hassan Sardar Commented Feb 21, 2014 at 7:50

4 Answers 4

Use the open() function

function openPopup(el) { // get the class name in arguments here
            $.magnificPopup.open({
                items: {
                    src: '#thanksModal',
                },
                type: 'inline'
            });
}

JSFiddle : http://jsfiddle/t5f5e5zw/2/

You have to pass the class name of clicked button in the function:

function openPopup(el) { // get the class name in arguments here
   $('.'+el).magnificPopup({ // use it here
      type: 'inline',
      modal: false
   });
}

$(function () {
   $('.ajax-call').click(function (e) {
      openPopup(this.className); //<----pass the clicked button's class name
   });
   $(document).on('click', '.closePopup', function (e) {
      e.preventDefault();
      $.magnificPopup.close();
   });
});

Demo Fiddle

magnificPopup is not a function error. Please include any custom js files in your header section.

Try this

function openPopup()
        {

            $('.ajax-call').magnificPopup({

            type: 'inline',
            modal: true,

        });

        /*$.magnificPopup({



 type: 'inline',
        modal: false,

    });*/

    $(document).on('click', '.closePopup', function (e) 
                {
                    e.preventDefault();
                    $.magnificPopup.close();
                });

    }