KendoUI窗口动态打开

时间:2015-05-25 05:43:40

标签: javascript kendo-ui

我想使用kendoui窗口打开一个动态数量的窗口,理想情况下,如果该窗口已经按名称存在,它只会显示相同的窗口。

所以我想象一个javascript函数

win(name, url, width)

我会从各个地方称呼这个

<button onclick="win('my window', '/example/view', 100);">click me</button>

我不确定如何使用其名称创建这样的窗口以及如何检查它是否已存在。

应用程序非常简单,一系列菜单和每个菜单打开一个窗口,但菜单是从数据库内容驱动的,因此我无法预定义所有窗口

2 个答案:

答案 0 :(得分:3)

win函数中,您应该检查是否已经创建了KendoUI窗口。如果是,则重用现有的并打开它。否则你就创建了它。

示例:

function win (name, url, width) {
    var my_win = $("#" + name).data("kendoWindow");
    if (my_win) {
        // already exist, reuse it
        my_win.open();
    } else {
        // does not exist, create it
        // create a div with id "name" for my window and append it to 
        // to a container ("example") where all the windows are going to be.
        my_win = $("<div id='" + name + "'></div>").kendoWindow({
              title: name,
              content: url,
              width: width,
              appendTo: "#example",
              visible: true
        });
    }
}

编辑:要从锚元素(a)调用此内容,请将win全局定义到您的网页,并按以下步骤定义锚点。

  <a href="javascript: win('id1', '/page1', 200);">Open id1 window</a>
  <a href="javascript: win('id2', '/page2', 200);">Open id2 window</a>

此处示例:http://dojo.telerik.com/@OnaBai/ekIba/2

答案 1 :(得分:0)

一旦KendoUI窗口打开,它将创建一组以<div class="k-widget k-window" data-role="......开头的HTML元素。对于每个窗口,它将创建单独的HTML集。

因此,您可以使用var kendoeWinElems = $('.k-window')

过滤所有窗口

在循环中挖掘标题区域(.k-window-title)并与窗口的名称和标题进行比较,然后调用relaventWindow.data("kendoWindow").open();

为了便于比较和过滤,我建议您根据需要为按钮和Kendo窗口添加数据属性或类

希望这有帮助!!!!