in a fancybox onClosed function, how to access the element that was clicked to close the fancybox

Question

From within the onClosed function, I want to determine what is the ID of the element that was clicked to close the fancybox. I need to provide a different onClosed behavior depending on how the box was closed.

Suppose I have a button within my fancybox that the user can click to close the box and go to a registration page:

<button id="user-register" onclick="parent.jQuery.fancybox.close();parent.location.href='/user/register';"><h3>Sign Up <strong>Now!</strong></h3></button>

And in my fancybox call that opened the box, I have an onClose function that normally reloads the parent:

'onClosed': function() { 
        /*mytest = $('#fancybox-content iframe').contents().find('#user-register');
        console.log(mytest);*/
        if ($('body').hasClass('not-logged-in')) { 
          parent.location.reload(true);
        }  
      }

The reason to reload the parent is because in some cases the user will log in inside the fancybox, and I want the parent to reflect that the user has logged in. But in cases where the user clicks the registration button, I do not want the parent to reload, because then the user is not sent to /user/register. You can see how, in my onClosed function, I'm trying to find a way, in the commented out code, to access the #user-registered button. I was hoping its length would not be zero in the onClosed function when it is the element that was clicked on to close the box, but in fact its length is always zero in this context, presumably because the box is already closed when the onClosed function runs. I also tried inspecting the arguments variable that's available in the onClosed function, but it refers to the element that opened the box, rather than the one that closed it.

I also tried passing an argument to the close() function to see if that would somehow be available in the onClosed function -- e.g., close('user-register'). That arg doesn't seem to be available, though.

Any ideas how to know how a box was closed from within the onClosed function?

Thank you

Shant Shant · Accepted Answer · 2012-05-25T14:27:57

Declare a variable (with global scope) on parent page, which you can access in fancybox page using parent.varname. Set the value of this variable onclick of the button or any event that gets fired before fancybox closes. Then in the parent page, you can check the value of this variable in OnClosed event of fancybox. Hope this helps.

in a fancybox onClosed function, how to access the element that was clicked to close the fancybox

1 Answers