如何从对话框代码中关闭jQuery UI对话框？

我在我的应用程序中使用了几个jQuery UI对话框来收集用户和CRUD操作的输入。当在一个页面中，我需要一个对话框，我做以下步骤：如何从对话框代码中关闭jQuery UI对话框？

首先我定义所需的最低标记和代码来初始化对话框这样

<div id="dialogPanel" style="display:none" title=""></div>

，当DOM就绪，

$("#dialogPanel").dialog({ 
    autoOpen: false, hide: 'slide', show: 'bounce', resizable: false, 
    position: 'center', stack: true, height: 'auto', width: 'auto', 
    modal: true, overlay: { opacity: 0.5, background: "white" } 
});

然后我在对话框中加载内容时，我需要它使用AJAX调用，这样

<button id="addCustomer">Add Customer</button>

，这

$("#addCustomer").button().click(function(event) { 
    event.preventDefault(); 
    loadDialog("/Customer/Create", "", "Add New Customer"); 
}); 

function loadDialog(action, id, title) { 
    $("#dialogPanel").dialog("option", "title", title); 
    if (id != "") 
     action = action + "/" + id; 
    $.ajax({ 
     type: "get", 
     dataType: "html", 
     url: action, 
     data: {}, 
     success: function(response) { 
      $("#dialogPanel").html('').html(response).dialog('open'); 
     } 
    }); 
}

Ajax调用返回强类型视图，将显示在对话框内甚至dinamically调整其大小。强类型视图具有一些按钮，这些按钮反过来执行其他ajax调用（例如，用于在数据库上验证并持久化的控制器操作）。这些调用通常会返回将添加到对话框DIV的HTML代码。

现在我的问题是：如何关闭对话框？我可以通过点击对话框右上角的“X”按钮或者按下ESC键来实现，但是我想要这样做是因为点击了强类型视图中的按钮。

但是我不希望使用这种代码

$("#dialogPanel").dialog('close');

不定义本身#dialogPanel DIV一个强类型视图中。

什么可能是一个好的解决方案？

来源

2010-10-01 Lorenzo

在主窗体中创建一个closeDialog函数，并在对话框中调用该函数。然后，承载对话的任何其他页面也需要定义“closeDialog”函数。

另外，您可以传递一个指向closeDialog函数的委托来进一步分离事物。

来源

2010-10-01 19:21:36 Clicktricity

我一直在尝试解决这个问题很长一段时间了。这工作完美。谢谢 – 2011-02-15 20:47:47

如何从对话框代码中关闭jQuery UI对话框？

回答

相关问题