0

我有 2 个 Razor 视图，其中一个在 jQuery UI 对话框中加载另一个。在对话框中加载的视图中；我正在打开另一个 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 回答