1

JQueryダイアログを介して表示されるiframeにロードするaspxページがあります。このページには、JQuery ダイアログを正常に閉じる「CloseMe」スクリプトを呼び出す [キャンセル] ボタンがあります。このページには、ポストバックする [保存] ボタンもあります。データが保存されたら、ダイアログを閉じたい。

document.ready に「CloseMe」関数を呼び出す起動スクリプトを登録してみました。私がそうすると、コードは意味をなさない JQuery で javascript エラーをスローし始めます。「配列が未定義」「関数が未定義」「日付が未定義」のように。編集: 「window.parent.$...(close) ステートメントにヒットしたときにこれを行います。その行の直前にあるアラートに注意してください。iframe の ID を正しく報告します。

キャンセルボタンと同じ「CloseMe」機能を使用すると、すべて正常に機能します。

編集: デバッガーで 25 個ほどのエラーをすべて無視した後、ダイアログは閉じます。

ダイアログを開くJavaScriptは次のとおりです。

function jQueryShowiFrame(url, title, reloadOnClose) {

    $('<iframe id="modalIframeId" allowtransparency="true" frameborder="0" src="' + url + '" />').load(function () {

        var width = $("#modalIframeId").contents().width();
        var height = $("#modalIframeId").contents().height();
        var paddingWidth = parseInt($("#modalIframeId").css("padding-left"), 10) + parseInt($("#modalIframeId").css("padding-right"), 10);

        // the sequence of these steps is important
        $("#modalIframeId").dialog("option", "width", (width + paddingWidth) + 'px');

        this.style.width = width + 'px';
        this.style.height = height + 'px';

        $("#modalIframeId").dialog("option", "position", "center");
    })
    .dialog({
        title: title,
        modal: true,
        close: function (ev, ui) {
            $(this).dialog('destroy').remove();
            if (reloadOnClose) {
                location.reload();
            }
        },
        open: function (ev, ui) {
            //alert('x');
        }
    });
}

ページのマークアップは次のとおりです。

<asp:Button ID="btnSave" runat="server" CssClass="BasicButton" Text="Save" />
<button type="button" id="btnClose" onclick="closeMe()" >Cancel</button>

<script type="text/javascript">

    function closeMe() {
        alert(window.frameElement.id);
        window.parent.$('#' + window.frameElement.id).dialog('close');
    }
</script>

[保存] ボタンのクリックの背後にあるコードは次のとおりです。

Dim scr As String = "$(document).ready(function () { closeMe(); });"
ScriptManager.RegisterStartupScript(Me.Page, GetType(Page), Guid.NewGuid.ToString, scr, True)
4

1 に答える 1

0 
function jQueryShowiFrame(url, title, reloadOnClose) {

    $('<iframe id="modalIframeId" allowtransparency="true" frameborder="0" src="' + url + '" />').load(function () {

        var width = $("#modalIframeId").contents().width();
        var height = $("#modalIframeId").contents().height();
        var paddingWidth = parseInt($("#modalIframeId").css("padding-left"), 10) + parseInt($("#modalIframeId").css("padding-right"), 10);

        // the sequence of these steps is important
        $("#modalIframeId").dialog("option", "width", (width + paddingWidth) + 'px');

        this.style.width = width + 'px';
        this.style.height = height + 'px';

        $("#modalIframeId").dialog("option", "position", "center");
    })
    .dialog({
        title: title,
        modal: true,
        /*Add a Property */
        autoOpen : false, /* Instead of Calling 'CloseMe' */
        close: function (ev, ui) {
            $(this).dialog('destroy').remove();
            if (reloadOnClose) {
                location.reload();
            }
        },
        open: function (ev, ui) {
            //alert('x');
        }
    });
}

autoOpen:false起動時にダイアログが開かれないようにするために使用します。関数を呼び出す代わりに使用しCloseMeます。

それが役に立てば幸い。

于 2013-10-22T16:22:57.653 に答える