Window generated underneath view

[Andrew]

Hi,

Upon loading my view, the window I have initiated cannot be seen. Upon using the browser developer tools I can see that the window does exist (class="k-widget k-window").

The code for this view is as follows:

<div data-role="view" data-after-show="aftershow">
    <div data-role="header">
            <div data-role="navbar">
                //nav stuff in here
            </div>
    </div>

    <p>Hi</p>
    <div id="window">
        Content of the Window
    </div>
    <script>
        $("#window").kendoWindow();
    </script>
</div>

The screenshot below shows what I see using the browser developer tool:
http://sdrv.ms/17vSVdW

It is worth noting that this view is access remotely, using a drawer. The page loads fine and other kendo ui stuff loads normally.

Any help would be appreciated.

[Kiril Nikolov]

Hello Andrew,

I would suggest you to take a look at the ModalView control that comes with Kendo UI Mobile, which basically a window, but optimized for using in a mobile application. Please follow this link to see a demo:

http://demos.kendoui.com/mobile/modalview/index.html#/

To fire the window you need to click on the Login button.
 
Regards,
Kiril Nikolov
Telerik

[Andrew]

Kiril,

Thanks for the advice. I am specifically wanting the ability to resize and move content around the page, am I right in thinking this is not possible with the modal view?

Thanks,
Andrew.

[Kiril Nikolov]

Hi Andrew,

You are correct that the Kendo UI Mobile ModalView does not have methods for resizing and moving the content around the page. However all the sizing and positioning is done via CSS rules, that can be overwritten to achieve the look that is needed. Using your developer tools you can inspect the parent div holding the ModalView and there you can see how it is sized and positioned on the screen.

Please check the screenshot attached.
 
Regards,
Kiril Nikolov
Telerik