0

I could successfully open a Kendo Window by clicking on the menu.

My requirement is like, if I click on a button on this window, it should dynamically create an iframe and append to a div and append this new div to the parent container and show as a new window just like I open it from the menu.

I could successfully add the iframe and div to the parent, but when I open the window, its open inside the the window where I am and not from the parent container. My code is as below:

  $("#btn").click(function () {

        var k = "<div id='kk'><iframe style='height:600px;width:900px'></div>";
        $("#menuDiv", parent.document).append(k);

        $("#kk", parent.document).kendoWindow();
    });
4

1 回答 1

1

知道窗口是浮动的，尽管包含它的 HTML 元素，从另一个打开它甚至动态生成打开的窗口的内容是非常简单的。

给定以下包含原始窗口的 HTML 代码：

<div id="container">
    <div id="win1">
        <h1>Window 1</h1>
        <button id="open" class="k-button">Open</button>
    </div>
</div>

我们将click按钮的处理程序定义为：

$("#open").on("click", function() {
    var w2 = $("<div>Window2</div>");
    $("#container").append(w2);
    w2.kendoWindow({});
});

我们将w2动态生成的第二个窗口 () 附加到container第一个窗口的 ，然后将其初始化为kendoWindow.

我们可能已经将第二个窗口添加到第一个窗口，如下所示：

$("#open").on("click", function() {
    var w2 = $("<div>Window2</div>");
    w1.element.append(w2);
    w2.kendoWindow({});
});

在哪里w1，var w1 = $("#menuDiv").data("kendoWindow");但这没有任何区别，因为窗口是浮动元素，不受其父 HTML 节点的约束。

你可以在这里看到它的作用：http: //jsfiddle.net/OnaBai/juunjch1/

如果您希望打开的窗口的内容是一个，iframe您应该实际创建window选项iframe设置为true. 就像是：

$("#open").on("click", function() {
    var w2 = $("<div>Window2</div>");
    $("#container").append(w2);
    w2.kendoWindow({
        content: "http://www.telerik.com",
        iframe: true
    });
});

你可以在这里看到它：http: //jsfiddle.net/OnaBai/juunjch1/2/

于 2014-09-02T15:43:40.240 回答