Declined
Last Updated: 25 Aug 2021 08:54 by ADMIN
Chuck
Created on: 18 Aug 2021 18:49
Category: Window
Type: Bug Report
0
grid in modal

If I have a grid inside a TelerikWindow, when I show the window allowing it to be draggable, there seems to be undesired behavior.  In my environments, with 2.26.0, the TelerikWindow extends to the right of the screen and the draggable operation is impacted.  I have the following code (very cut-down and simplified) as my Index.razor.  If you click the button and start dragging the window around you should see what I am referring to.

 

@page "/"

<TelerikButton OnClick="@ShowModal">Show Modal</TelerikButton>

<TelerikWindow Modal="true" Draggable="true" @bind-Visible="@isModalVisible">
   <WindowTitle>
      <strong>Sample</strong>
   </WindowTitle>
   <WindowContent>
      <TelerikGrid Data="@objectList" >
         <GridColumns>
            <GridColumn Field="@(nameof(SampleObject.Name))" Title="Name" />
            <GridColumn Field="@(nameof(SampleObject.Description))" Title="Description" />
         </GridColumns>
      </TelerikGrid>
   </WindowContent>
   <WindowActions>
      <WindowAction Name="Close" />
   </WindowActions>
</TelerikWindow>

@code {
   public bool isModalVisible = false;
   public List<SampleObject> objectList = new();

   protected override void OnInitialized()
   {
      objectList.Add(new SampleObject() { Name = "Object 1", Description = "description for object 1" });
      objectList.Add(new SampleObject() { Name = "Object 2", Description = "description for object 2" });
   }

   public void ShowModal()
   {
      isModalVisible = true;
   }

   public class SampleObject
   {
      public string Name { get; set; }
      public string Description { get; set; }
   }
}
2 comments
ADMIN
Hristian Stefanov
Posted on: 25 Aug 2021 08:54

Hi Chuck,

This behavior is discussed in the following Knowledge base article:

Window Expands When Dragged

The content placed in the Modal Window needs to have explicit dimensions set in pixels. This is necessary, as otherwise, you get a confrontation of concepts - a block element (such as div or table) by default takes the width of its parent - 100% of it. This means that it tries to autosize according to the Modal Window. At the same time, we want the Modal Window to autosize itself according to the element inside (in this case a Grid), which leads to this obvious contradiction. This is the reason why some explicit dimensions have to exist in the content.

You are on the right path that setting the Width of the content or the Modal is covering the requirements in these scenarios.

I hope this clarifies why the behavior is expected and cannot be classified as a bug. If you have any other questions, I would be glad to help.

Regards,
Hristian Stefanov
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Chuck
Posted on: 18 Aug 2021 18:52
Forgot to mention that if I hard-set a width, this doesn't seem to happen.  That is a workaround I am using now, but just wondering if there is a reason for this behavior.