0

jQuery UI ダイアログで一方が他方をロードしている 2 つの Razor ビューがあります。ダイアログに読み込まれるビューで。メッセージを表示するために、別の jQuery UI ダイアログを開いています。

目的は、メッセージ ダイアログCancelボタンがクリックされたときに両方のダイアログを閉じることです。

かみそりのコードは次のとおりです。

メインビュー

<button id="openModel" onclick="openModel()">

<div id="mainDialog" />

<script type="text/javascript">
    function openModel() {
        $('#mainDialog').dialog({
            open: function () {
                // loading "the secondary view in the model dialog"
                // url: controller-action url to load the second view
                $(this).load('url'); 
            }
        });
    }
</script>

ダイアログ ビュー

<button id="messageOpener">Verify</button>

<div id="messageDialog" />

<script type="text/javascript">

    $(document).ready(function () {

        $("#messageOpener").click(function () {
            $("#messageDialog").dialog("open");
                return false;
        });

        $("#messageDialog").dialog({
            buttons: {
                Retry: function () {
                    $(this).dialog("close");
                },
                Cancel: function () {
                    // **** ?? must close both dialogs. ****
                }                
            },
            autoOpen: false,
        });
    });

</script>

ダイアログを閉じるために、次のアプローチを試しました。

アプローチ 01: 

$(".ui-dialog-content").dialog("close");

アプローチ 02:

$(this).dialog("close");
$("#mainDialog").dialog("close");

アプローチ 03:

$(".ui-dialog:visible").find(".dialog").dialog("close");

ただし、上記のすべてが期待どおりにダイアログを閉じず、代わりに次の JS エラーが生成されます。

不明なエラー: 初期化の前にダイアログでメソッドを呼び出すことはできません。メソッド「close」を呼び出そうとしました
v.extend.error
(無名関数)
v.extend.each
v.fn.v.each
e.fn.(無名関数)
$.dialog.buttons.Cancel
r.click
v.event.ディスパッチ
o.handle.u

4

2 に答える 2

1

次のようにコードを書き直すと、問題が解決します。

1. メインビュー

<button id="openModel" onclick="openModel()">

<div id="mainDialog" />

<script type="text/javascript">

    var $modelDialog = $('#mainDialog').dialog({
        autoOpen: false,
        open: function () {
            // loading "the secondary view in the model dialog"
            // url: controller-action url to load the second view
            $(this).load('url'); 
        }
    });

    function openModel() {
        $modelDialog.dialog('open');    
    }

    function closeModel() {
        $modelDialog.dialog('close');    
    }

</script>

2. ダイアログビュー

<button id="messageOpener">Verify</button>

<div id="messageDialog" />

<script type="text/javascript">

    var $messageDialog;

    $(document).ready(function () {

        $("#messageOpener").click(function () {
            $messageDialog.dialog("open");
                return false;
        });

        $messageDialog = $("#messageDialog").dialog({
            buttons: {
                Retry: function () {
                    $messageDialog.dialog("close");
                },
                Cancel: function () {
                    // [!!]
                    $messageDialog.dialog("destroy");
                    closeModel();
                }                
            },
            autoOpen: false,
        });
    });

</script>
于 2013-01-31T09:07:20.110 に答える
0

アプローチ 2 は問題ないように見えますがmainDialog、ダイアログを閉じようとするとモーダルが開かれないというエラーが発生しますmessage。また、関数openModelはどこにも呼び出されません。

于 2013-01-20T07:09:43.763 に答える