Hi, in our team we had issues with a tricky bug that we discovered in Safari for Kendo UI for Angular.

Steps to reproduce

1. In Safari, make sure that content is scrollable by having content that does not fit in the current size of the browser window. 

2.  Open a kendo window over the content, with a kendo datepicker inside.

3.  Possibly make the browser window smaller in height (depending on the screen resolution).

4. Open the datepicker popup.

Expected behaviour

Kendo window along with its content stay were it is. 

Actual behaviour

The kendo window jumps upwards and is partially out of view. 

If the page is still scrollable the user can scroll back to see all of the kendo window. For my team the problem was that we have an "overflow: hidden" css style on the body to prevent scrolling outside the kendo window when it is opened. This is problematic for the user since they cannot scroll back to see all the content of the kendo window. This problem only happens in Safari.

Solution

To solve it we set "position: fixed" on the wrapping element of the kendo window.

Stackblitz

https://stackblitz.com/edit/angular-p1tgbe-u8g3ff

I am using the WindowService to open a window and passing in a template for the content. Once the user performs their action within the window, I want to close it.

I tried adding

public window : WindowRef

to my constructor, but this threw an error, 'No provider for WindowRef'

Hi -

I would like to add a maximize and close buttons to my kendo-toolbar (I don't want to use kendo-window)

How can I do this?

Thanks

Hi -

I've been trialing kendo UI for angular and it is pretty powerful

I would like to use the kendo-window toolbar as my kendo-tile "toolbar"

The main feature I want to leverage from the kendo-window doing so is the "Maximize" and "Close" features ("Minimize" should be disabled or better yet not visible)

I do want to use kendo-tile to leverage dragging and autoflow repositioning

Is there any way to do this?

Would greatly appreciate your help

Thanks

Hello!

Is there any option to pin window to some DOM element, so that when i am scrolling whole page the window could scrolls together with it? I saw similar option in Kendo UI for jQuery. Or maybe you can suggest some workaround?

I also tried to use specifying custom window container but it is actually now working as I expected.

Thank you in advance!

Hi there,

I'm using a Kendo Window for a form and when a vertical scrollbar is necessary, the action buttons (save, cancel) are not visible because you have to scroll to the bottom to see them. How could I get them to stay fixed?

Thank you

I have an app that is launching a window via the WindowService open method and I want to set the "themeColor" for the window.  There is no themeColor property available in the WindowsSettings.  I did try setting it via htmlAttributes, but that didn't have any effect. 

Am I just missing something?

    const windowRef = this.windowService.open({
      title: appointment.event?.name, 
      content: AppointmentModalViewComponent,
      width: 500,
      minWidth: 450,
      htmlAttributes: {
        "themeColor": "primary"
      }
    });

I am trying to utilize the WindowService to dynamically create a Window instance from another component. The kendoWindowContainer lives in my app.component.html, but I am using the WindowService to create a window instance in a child component. 

Right now, when our app times out, and a log out is triggered, the window stays opens.

I've tried to use the WindowRef as a constructor parameter, also with the @Optional() decorator, and as a ViewChild, and window is always undefined. Not sure what I am doing wrong when trying to get the WindowRef reference.

Hi, 

I am making a standalone component using window, and I would like to make it modal - to prevent people clicking around while this window is open.

Is there any predefined way for making the window modal, or I have to explicitly use dialog for this?

Thank you

Regards,

Vedad