I've been banging my head all day on this. I know you can open a window and then say have a button that when clicked opens another window from inside that.
See here for a demo: http://plnkr.co/edit/vl2VTi6EIXKcViwl1xae?p=preview
In my project however I am trying to do the same thing but instead of working as expected it is rendering the kendo windows inline (as if they are just divs with content in them).
When I swap out the version of kendo I am using (v2015.3.930) with the version inside my plnkr (2014.2.716) my kendo-window divs are no longer rendered but they also still do not work.
What could cause this behavior with the kendo-window components? Could angular-ui-router have anything to do with this? The initial kendo-window is being called from a nested (named) ui-view. The only other javascript libraries I am using are angular-toastr and angular-local-storage (of which I don't think either could be the culprit).
5 Answers, 1 is accepted
Rank 1
More information: When I click the button to open my first window and has content such as:
<div kendo-window>I'm a window</div>
Testing
I see the text that says testing but I do not see any window.
Please help.
Rank 1
I have tried placing other kendo widgets into my window:
<button kendo-button>Click Me</button>
<input kendo-color-picker/>
And these work but the kendo-window does not.
Rank 1
I've modified my original plunk to use ui router in the same way as my application and it works as well: http://plnkr.co/lGZypc4qdTKy5i3qXiBD
What could cause the kendo windows to fail and have their contents rendered inline?
Rank 1
So after not wracking my brain on this for two days I finally figured out how to fix it BUT not what is causing the problem in the first place. I finally figured out that removing the k-options attribute and replacing with the k-* attributes I want to use inline makes the problem go away (so far).
This behavior is very inconsistent as you can clearly see in my plunker that k-options work. Another thing to note is that the attributes are acting inconsistently as well:
<div kendo-window="myWindow" k-visible="true" k-modal="true" k-title="'My Title'">I'm a window<div>
If I remove the single quotes from k-title it breaks the window.
Can any of the Kendo folks help me understand what is going on?
k-title requires a string value, that's why two pairs of quotes are needed, unless you provide an Angular expression (scope variable) as a value. This is how Angular works.
http://docs.telerik.com/kendo-ui/AngularJS/introduction#widget-options-in-html
Based on the provided information, we are not sure what causes the inner Window to not be initialized. Unless I am missing something, the provided Plunkr example works. In case you need further assistance, please provide a runnable example, which does not work as expected.
Generally, the Window's <div> is moved in the DOM and becomes a child of the <body> element when the widget is initialized. In some scenarios, this may lead to the widget to no longer be in its controller scope, so it cannot access its properties.
http://docs.telerik.com/kendo-ui/web/window/overview#html-structure-and-dom-placement
Regards,
Dimo
Telerik