Закрыть диалог jQuery UI из Iframe - PullRequest
25 голосов
/ 08 декабря 2010

Я реализовал следующий код для загрузки фотографий в диалоге jQuery (с использованием 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');
});

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

Есть идеи?

Ответы [ 4 ]

40 голосов
/ 09 декабря 2010

Чтобы заставить его работать, вы должны вызывать jQuery от родителя, а не из iframe.Чтобы сделать это, используйте следующее ...

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

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

5 голосов
/ 09 декабря 2010

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

$(document).ready(function () {
    $(parent.document).find('#imagePathValue').val('theimagevalue');
    window.parent.$('#upload-form').dialog('close');
});
2 голосов
/ 24 января 2011

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

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

0 голосов
/ 24 июня 2011

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

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

...