Fancy Box - how to refresh parent page when close iframe popup?

Question

I want my parent page to refresh when I close a Fancy Box popup frame. I have a login page inside the popup, so I need the parent page to refresh to show the new login state

Answer 1

Well I know this is an extremely old post but here's a newer answer that I hope helps someone out there. I am using fancybox on a page with my website inquiries to pop up in a lightbox to read / delete. When I delete an inquiry in the light box I wanted the parent to refresh to show a current list of inquiries minus the one I just deleted. The upvoted comment didn't help me (as it is probably referencing an older version of the JS file).

On line 105 of jquery.fancybox.js (v3.5.7) change:

afterClose: n.noop,

to

afterClose: function() {parent.location.reload(true);},

It's been irritating me for a few days but it now works no worries.

Answer 2

Besides the obvious missing , which you say you have fixed IMO this is not a fancybox issue but rather a parent refresh issue.

I have found it to be a challenge to get a parent of a frame to reload as there are multiple ways to "theoretically" achieve this but "most" simply do NOT work in practice and worse yet there really doesn't appear to be any error raised by the web browsers I tested with.

Here is code that works well for me on Chrome, FF, IE:

afterClose: function(){
    parent.location.href = parent.location.href;
},

This basically says set the parent href to whatever it is currently which in effect results in a page refresh. Try it out and it should work well.

In fact the line:

parent.location.href = parent.location.href;

can be used with frames (from the parent of course) or without frames to simply refresh a web page. HTH.

Answer 3

link refresh:

jQuery(function($){ 
    $('#refresh').click(function ()
        {      
            parent.location.reload();
    });
});

<a href="#" id="refresh">refresh</a>

you can give:

setTimeout(function () {
            parent.location.reload(); 
        }, 1000);

or condition, for example,

<script>
if(formSend == true){
setTimeout(function () {
                parent.location.reload(); 
            }, 1000);
}
</script>

Answer 4

'onClosed' : function() { parent.location.reload(true); }

Answer 5

$(".fancybox").fancybox({
            'width'             : '75%',
            'height'            : '65%',
            'autoScale'         : false,
            'transitionIn'      : 'none',
            'transitionOut'     : 'none',
            'type'              : 'iframe',
            'hideOnOverlayClick': false,
            'onClosed'          : function() {
                                  parent.location.reload(true);
                                  }
        });

Answer 6

When using the examples with 'location.reload' you get a browser pop that lets you know it needs to reload the page. I fired a button click to refresh the page and no warning popup.

$(".addDoc").colorbox({
    iframe: true, 
    width: "550px", 
    height: "230px",
    'onClosed': function() {
        $("#btnContSave").click();
    }
});