Resizing Grid Issues

Radzen.Blazor Components
1

I 'm using your free blazor components and I would like to report a bug.
When I resize a column the column I resize takes a very big length. When I check the style it has an invalid value. I suspect it is that comma character that is causing the problem and I beleive this is because we have set the current culture to greek.

    public class Program
    {
        public static async Task Main(string[] args)
        {
            CultureInfo.DefaultThreadCurrentCulture = new CultureInfo("el-GR");                
            CultureInfo.DefaultThreadCurrentUICulture = new CultureInfo("el-GR");

image
image3840×1080 552 KB

2

Thanks for report! We will include fix for this in our next update before the end of this week.

3

Thanks for your quick respond. I 'll be waiting;

4

I was not able to reproduce this in our demos. Can you try our demos at your end with desired culture settings?

image
image1920×1080 296 KB

image
image1920×1080 199 KB

5

I need to update to framework 6.0.
I will do so and let you know.
Thanks for your time

6

If you add random widths on the columns then for some reason the width comes back with decimals.
and the issue is reproduced . I rounded the number on OnColumnResized and it seems to resolve the issue partially but the behavior of resizing still remains wired and the size of the column is not exactly what I would expect it to be. Something with the drag and drop. I don't know. Also if you add allowsorting on mouseup the sorting is triggered and the resizing never happens.



> <RadzenExample Name="DataGrid" Source="DataGridColumnResizing" Heading="false">
>     <RadzenDataGrid Data="@employees" TItem="Employee"  ColumnWidth="300px" AllowColumnResize="true" ColumnResized=@OnColumnResized AllowSorting="true">
>         <Columns>
>             <RadzenDataGridColumn TItem="Employee" Property="EmployeeID" Title="ID" Width="50px" TextAlign="TextAlign.Center" />
>             <RadzenDataGridColumn TItem="Employee" Title="Photo" Sortable="false" Width="200px" >
>                 <Template Context="data">
>                     <RadzenImage Path="@data.Photo" style="width: 40px; height: 40px; border-radius: 8px;" />
>                 </Template>
>             </RadzenDataGridColumn>
>             <RadzenDataGridColumn TItem="Employee" Property="FirstName" Title="First Name" Width="50px"/>
>             <RadzenDataGridColumn TItem="Employee" Property="LastName" Title="Last Name" Width="150px"/>
>             <RadzenDataGridColumn TItem="Employee" Property="Title" Title="Title" Width="30px"/>
>             <RadzenDataGridColumn TItem="Employee" Property="TitleOfCourtesy" Title="Title Of Courtesy"  Width="10px"/>
>             <RadzenDataGridColumn TItem="Employee" Property="BirthDate" Title="Birth Date" FormatString="{0:d}" Width="40px"/>
>             <RadzenDataGridColumn TItem="Employee" Property="HireDate" Title="Hire Date" FormatString="{0:d}" Width="56px"/>
>             <RadzenDataGridColumn TItem="Employee" Property="Address" Title="Address"  Width="52px"/>
>             <RadzenDataGridColumn TItem="Employee" Property="City" Title="City"  Width="52px" />
>             <RadzenDataGridColumn TItem="Employee" Property="Region" Title="Region"   Width="52px"/>
>             <RadzenDataGridColumn TItem="Employee" Property="PostalCode" Title="Postal Code"  Width="52px"/>
>             <RadzenDataGridColumn TItem="Employee" Property="Country" Title="Country"  Width="52px"/>
>             <RadzenDataGridColumn TItem="Employee" Property="HomePhone" Title="Home Phone"  Width="52px"/>
>             <RadzenDataGridColumn TItem="Employee" Property="Extension" Title="Extension"  Width="52px"/>
>             <RadzenDataGridColumn TItem="Employee" Property="Notes" Title="Notes"  Width="52px"/>
>         </Columns>
>     </RadzenDataGrid>
> </RadzenExample>

 [JSInvokable("RadzenGrid.OnColumnResized")]
        public async Task OnColumnResized(int columnIndex, double value)
        {
            var column = columns.Where(c => c.Visible).ToList()[columnIndex];
            column.SetWidth($"{Math.Round(value)}px");
            await ColumnResized.InvokeAsync(new DataGridColumnResizedEventArgs<TItem>
            {
                Column = column,
                Width = value,
            });
        }
7

I played a little more with the demo and problem is that when you add random widths on all columns then actual widths are not the ones you have set but they are set proportionally according to the total width of the grid.If I dont set ColumnWidth on the grid and I leave the last column without width then the resizing works smoothly because the actual width are identitical to the widths I had set on the grid.

8

Goodmorning,

We are having the same issue with resizing. If all the columns have a set width, resizing is causing issues.
Is there news on this topic?

Thanks!

9

When you have defined width for all columns in table-layout: fixed and final column width will be different - this is how all browsers works. If you need to have exact column width as defined for all columns you will need additional dummy column at the end with no width defined.