在窗口中关闭一个带有自定义关闭按钮的kendoui窗口

我正在使用Kendo UI的窗口组件，它类似于任何modal dialog。

我有一个关闭按钮，如何在单击该按钮时关闭窗口（而不是单击标题栏中的默认“x”按钮）

我的窗口中的内容是从另一个视图加载的

@(Html.Kendo().Window() .Name("window") .Title("Role") .Content("loading...") .LoadContentFrom("Create", "RolesPermissions", Model.Role) .Modal(true) .Width(550) .Height(300) .Draggable() .Visible(false) ) 

在同一个观点中，我有

 Cancel 

这是我在主视图中的内容（调用窗口的视图）

 $(document).ready(function () { var window = $("#window").data("kendoWindow"); $("#open").click(function (e) { window.center(); window.open(); }); $("#close").click(function(e) { window.close(); }); }); 

Answer 1

基本上你已经知道如何关闭窗口 – 你需要使用其API的close方法来完成它。

 $("#window").data("kendoWindow").close(); 

但是为了将处理程序附加到视图内的按钮，您需要等到内容加载 – 您需要使用refresh事件。

例如

 $('#theWindowId').data().kendoWindow.bind('refresh',function(e){ var win = this; $('#close').click(function(){ win.close(); }) }) 

Answer 2

在JavaScript中 – HTML window是表示浏览器中的打开窗口的对象。 尝试将window定义为其他内容。

 $(document).ready(function () { var wnd = $("#window").data("kendoWindow"); $("#open").click(function (e) { wnd.center(); wnd.open(); }); $("#close").click(function(e) { wnd.close(); }); }); 

Answer 3

在剑道ui有一个事件，它应该是这样的

  $("#idofyourbutton").click(function () { $("#window").data("kendoWindow").close(); }); 

Answer 4

如果使用ajax加载的内容，Petur Subev的答案是完美的！ 我想举一个使用模板的例子，这更简单（而不是所有的请求都是由ajax）。 考虑以下模板：

现在，让我们加载模板e调用窗口关闭方法：

 function ExampleFn1(dataItem) { //create the template var template = kendo.template($("#Template_Example1").html()); //create a kendo window to load content var kWindow = openKendoWindow({ title: "Window Tests", iframe: false, resizable: false }).content(template(dataItem)); // call window close from button inside template $("#btn1").click(function (e) { e.preventDefault(); alert("btn1 on click!"); }); kWindow.open(); }