Закрыть jQuery UI Dialog from Iframe

Question

Я внедрил следующий код для загрузки фотографий в диалоговом окне jQuery (с использованием iframe).

Вот IFrame

<div style="display: none"> 
    <iframe id="upload-form" frameborder="0" marginheight="0" marginwidth="0" src="Upload.aspx"></iframe> 
</div> 

А вот код JQuery на родительской странице, которая заботится об открытии диалогового окна.

$("#upload-image").click(function (e) { 
    e.preventDefault(); 
    $('#upload-form').dialog({ 
     modal: true, 
     width: 300, 
     title: "Upload Image", 
     autoOpen: true, 
     close: function(event, ui) { $(this).dialog('close') } 
    }); 
}); 

Я затем нагнетаю скрипт (на странице IFrame) после загрузки успешно, который проходит результат обратно в родительской странице, но я хочу, чтобы закрыть диалоговое окно одновременно.

$(document).ready(function() { 
    $(parent.document).find('#imagePathValue').val('theimagevalue'); 
    $(parent.document).find('#upload-form').dialog('close'); 
}); 

The #imagePathValue проходит успешно, но я не могу показаться, чтобы иметь возможность закрыть диалоговое окно.

Любые идеи?

Answer 1

Для того, чтобы заставить его работать, вы должны вызвать Jquery от родителя, а не внутри фрейма. Для этого используйте следующие ...

window.parent.jQuery('#upload-form').dialog('close'); 

Это должно быть сделано!

Answer 2

Попробуйте это:

$(document).ready(function() { 
    $(parent.document).find('#imagePathValue').val('theimagevalue'); 
    window.parent.$('#upload-form').dialog('close'); 
}); 

Answer 3

В дополнение к этому вы также должны сделать это:

window.parent.$('#upload-form').remove(); 

поэтому экземпляр Iframe удаляется после закрытия диалога.

так Окончательный код должен быть:

$(document).ready(function() { 
    $(parent.document).find('#imagePathValue').val('theimagevalue'); 
    window.parent.$('#upload-form').dialog('close'); 
    window.parent.$('#upload-form').remove(); 
}); 

Благодаря Kaushal

Answer 4

Определенно помните, что называть эти типы функций, он должен обратиться к функции в самом родительском документе. Когда вы используете второй аргумент конструктора jquery, вы указываете только цель метода, а не где его выполнять.

Именно поэтому $('element', window.parent.document).method(); не будет работать, и window.parent.jQuery('element').method(); будет.