Fancyapp Modal Box closing iFrame - modal-dialog

Question

I am using the following Modal popup script: http://fancyapps.com/fancybox/
I have a modal popup with a IFrame. In the iFrame there is a a registration form. When the user registers they are redirected to a members only page. Currently they are being redirected in the same modal window. I want it so that the modal window closes and a the page where they clicked the modal window redirects to the members only link.
Here is the javascript:
$(document).ready(function() {
$(".various").fancybox({
'width' : '85%',
'height' : '86%',
'paddingTop' : '40',
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none',
'type' : 'iframe'
});
});
Here is the HTML that calls the modal box:
<a class="various button" data-fancybox-type="iframe" href="/signup-test">

Answer 1

Since you only want to redirect members who've successfully registered, you need to insert code to redirect the user into the success function of your registration and/or validation code.
I can't address your specific example without the rest of your code, but two ways to do this are:
Option 1 - Create A Javascript Function
You can create a Javascript function which closes the iframe and redirects the user. The trick to doing this is putting the script in the parent document so that the script continues executing once the iframe closes.
This function goes in the parent document:
function closeiframe_redirect(url){
$.fancybox.close();
window.location = url;
}
Insert this code when you want to call the function:
parent.closeiframe_redirect('members_page.html');
Option 2 - In an AJAX Success Function
submitHandler: function (form){
$.ajax({
type: 'POST',
url: 'registration-exec.php',
data: $("#loginForm").serialize(),
success: function(data) {
if(data == "true") {
// This closes the Registration Form
$("#registrationForm").fadeOut("fast");
window.location = 'members_page.html'
}
});
}