FancyBox close from within iframe and take parent page to the link

Question

I found applying the following function to a links onclose works to close Fancybox from within an iFrame: parent.$.fancybox.close();

I want to take this further and have the link take the parent page to a new url. I've tried the following but it doesn't work:

<a onclick="location.href='http://www.domain.com/page/';parent.$.fancybox.close();"> Close and go to page</a>

using a href doesn't work either as the onclose takes precedence.

Longfaced

Answer 1

Very simple solution... can't believe I didn't think of this!!!

<a href="http://www.domain.com/page/" target="_parent"> Close and go to page</a>

Sometime, I swear I try to make things more difficult than they actually are!

Longfaced

Man, I don't care this is just a "thank you" reply. Be well and thank you. Clean and quick solution. – Harleigh

Answer 2

You can also do this by writing a function on the parent page:

function closeFancyboxAndRedirectToUrl(url){
    $.fancybox.close();
    window.location = url;
}

Then on the link within the iframe, you can do this:

<a onclick="parent.closeFancyboxAndRedirectToUrl('http://www.domain.com/page/');">Close and go to page</a>

Kennedy

This is also quite useful if you want to use a function in the modal that calls a function in the parent to actually close it (extremely useful for showing notifications within the parent when the modal closes, e.g after submitting a form) – Pegram

Answer 3

no need to close fancy box just use

function name(){
    self.parent.location.href='pageg.php';
}

Ineluctable

I've tried all the suggestions above and only this one worked for me! Thank you! – Felizio