pass value/variable from fancybox iframe to parent

fancybox-2, iframe, javascript, jquery

Solution

When the fancybox is closed the iframe is removed from the document. So you must use `beforeClose` event instead of `afterClose`

$(document).ready(function() {
    $('a.fancybox').fancybox({
        openEffect:'fade',
        openSpeed:500,
        beforeClose: function() {
            // working
            var $iframe = $('.fancybox-iframe');
            alert($('input', $iframe.contents()).val());
        },
        afterClose: function() {
            // not working
            var $iframe = $('.fancybox-iframe');
            alert($('input', $iframe.contents()).val());
        }
    });
});

JSFiddle: http://jsfiddle.net/NXY7Y/1/

EDIT:

I edited your jsfiddle (http://jsfiddle.net/NXY7Y/9/). Update is in this link http://jsfiddle.net/NXY7Y/13/

Main page javscript:

$(document).ready(function() {
    $('a.fancybox').fancybox({
        openEffect:'fade',
        openSpeed:500//,
        //beforeClose: function() {
        //    // working
        //    var $iframe = $('.fancybox-iframe');
        //    alert($('input', $iframe.contents()).val());
        //},
        //afterClose: function() {
        //    // not working
        //    var $iframe = $('.fancybox-iframe');
        //    alert($('input', $iframe.contents()).val());
        //}
    });
});

function setSelectedUser(userText) {
    $('#username').val(userText);
}

No need to use `afterClose` or `beforeClose` events. Just access the parent function `setSelectedUser` from the iframe on link click event like this:

$(document).ready(function() {
    $('a.insert_single').click(function() {
        parent.setSelectedUser($(this).text());
        parent.$.fancybox.close();
    });
});

Problem

I'am trying to pass a variable/ value from the fancybox iframe to the parent window without success. Fancybox is launched from a link with ``` class="fancybox fancybox.iframe" ``` My code in the fancybox.iframe is: ``` $(document).ready(function(){ $('.insert_single').click(function(){ var test = $('.members_body').find('{row.U_USERNAME}'); setTimeout(function(){ parent.$.fancybox.close();},300);return true; }); }); ``` Where '{row.U_USERNAME}' is the username to find in the iframe. Then, in the parent there's the following code: ``` $(document).ready(function(){ $('.fancybox').fancybox( { openEffect:'fade', openSpeed:500, afterClose: function(){ alert($(".fancybox-iframe").contents().find(test)); $('#form input[name=username]').val()(test);return false; } } ); }); ``` But when the fancybox is closed, there's no alert showing up with the variable "test", nor the variable is showing up as a value or as a text in the input field of the form. I've read and tried various solutions found here on stackoverflow without success. Thanks in advance for helping EDIT Here's an Example

Original source