Please Please Please help me.. I have been trying to get the magnific popup ajax box to show login form. It seems that form appears but as soon as I click anywhere in form or ajax body, it disappears. below is the code
$(document).ready(function() {
$('.ajax-popup-link').magnificPopup({
type: 'ajax',
alignTop: false,
closeOnContentClick: false,
overflowY: 'scroll'
});
});
<a class=".ajax-popup-link" href="result.php">try me</a><br>
Below is the php that I look to load in ajax box. This is not the complete one
Email:<div class="field_container">Password:</label>
<input type='password' name='cust_password' id='password' maxlength="12" style="width: 250px; height: 30px"; /></div>
<input type='submit' name='Submit' value='Login' />
This is the old thread but for all the future readers: to fix this, there has to be only one root element in the html that comes out from the ajax call:
As per documentation:
http://dimsemenov.com/plugins/magnific-popup/documentation.html#ajax_type
So in your ajax call you should return something like this:
and your popup will no longer close itself on content click.
I solved the problem removing HTML and BODY tags in result.php.
I had the same problem, solved it by using:
instead of: