RadzenGrid - Expand and ColumnResize - Help

Radzen.Blazor Components
#1

Need help.

I am having two problems on the grid. First, by redefining the column size and the other by expanding the row.

Below, videos of the strange behaviors of both features.

Column size (never worked since launch)
https://youtu.be/KuTY_V-oBS0

    <Template Context="entidade">
        <GridUnidadeSaude EntidadeID="entidadeSel.EntidadeID" CidadeID="entidadeSel.CidadeID" />
    </Template>

Line expansion (problem appeared after the last update)
https://youtu.be/bR_CX20aJPo

<RadzenGrid @ref="itemGrid"
            TItem="Cbo"
            Data="@itemList"
            AllowFiltering="true"
            FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive"
            AllowPaging="true"
            AllowSorting="true"
            AllowColumnResize="true"
            PageSize="10"
            ColumnWidth="200px"
            Responsive="true"
            RowSelect="@(args => cbo = args)"
            EmptyText="Não há registros para exibir"
            ApplyFilterText="Aplicar filtro"
            ClearFilterText="Limpar filtro"
            EqualsText="Igual"
            NotEqualsText="Diferente"
            LessThanText="Menor que"
            LessThanOrEqualsText="Menor ou igual que"
            GreaterThanText="Maior que"
            GreaterThanOrEqualsText="Maior ou igual que"
            EndsWithText="Terminando com"
            ContainsText="Contendo"
            StartsWithText="Iniciando com">

AspNetCore: 5.0.3
Radzen.Blazor: 3.0.9

(Blazor) DataGrid AllowColumnResize property
#2

Does anyone have an idea of what could be affecting the grid's behavior?

Please...

#3

I am unable to find the source of the problem. Changing the column size or clicking on the row expansion triggers reordering of the records and the grid has strange behavior.

Has anyone ever experienced this? I am in need of help from the Radzen community !!!

#4

Hello @licitec, from another brazilian dev.

Your column resizing is messed up because you're setting the default ColumnWidth to 200px. This property is used to calculate the column widths when dragging its borders.
Changing it to auto will fix your problem.

1 Like
#5

Regarding your line expansion problem, you're probably not binding the filtered data to the DataGrid, which is then overwritten when expanding the row. I don't use row expansion at the moment, but this is how I apply custom filtering to grids:

image
image1279×695 25.5 KB

image
image
image1020×694 43.6 KB

image
image1635×276 14.7 KB

#6

Fact !!!!

I had reviewed everything and had not attended to this property.
Thank you very much !!!!

#7

Regarding line expansion, it seems that it is incompatible with the use of 'FilterTemplate', as follows:

<RadzenGrid @ref="itemGrid"
TItem="Entidade"
Data="@(itemList.Where(e => (naturezaSel != null ? e.NaturezaJuridica.NomeNaturezaJuridica == naturezaSel : true)
&& (situacaoSel > 0 ? e.Situacao == situacaoSel : true)))"

When we switch to 'Data="@itemList" it works again.
But, then we don't have an alternative to use FilterTemplate

        <RadzenGridColumn TItem="Entidade" Property="Situacao" Title="Situação">
            <Template Context="data">
                @Tools.GetDisplayName(data.Situacao)
            </Template>
            <FilterTemplate>
                <RadzenDropDown AllowClear="true" @bind-Value="@situacaoSel" Style="width:100%" TextProperty="Text" ValueProperty="Value"
                                Data="@(Enum.GetValues(typeof(SituacaoEnum)).Cast<SituacaoEnum>().Select(t => new { Text = $"{Tools.GetDisplayName(t)}", Value = t }))" />
            </FilterTemplate>
        </RadzenGridColumn>

Demo Radzen Blazor

That is the problem. Line expansion with the FilterTamplate model suggested in the examples generates instability in the grid.

How then to share the functionality of line expansion, persistence of filter parameters, advanced filter, etc. with 'enum' columns that require Template and FilterTemplate?

        <RadzenGridColumn TItem="Entidade" Property="Situacao" Title="Situação">
            <Template Context="data">
                @Tools.GetDisplayName(data.Situacao)
            </Template>
            <FilterTemplate>
                <RadzenDropDown AllowClear="true" @bind-Value="@situacaoSel" Style="width:100%" TextProperty="Text" ValueProperty="Value"
                                Data="@(Enum.GetValues(typeof(SituacaoEnum)).Cast<SituacaoEnum>().Select(t => new { Text = $"{Tools.GetDisplayName(t)}", Value = t }))"  />
            </FilterTemplate>
        </RadzenGridColumn>

public enum SituacaoEnum : byte
{
    [Display(Name = "Ativo")]
    Ativo = 1,
    [Display(Name = "Bloqueado")]
    Bloqueado = 2,
    [Display(Name = "Inativo")]
    Inativo = 9
}
#8

Have you tried setting the drop down data value to a variable on page load, and then binding this variable to the data property?

Radzen sometimes has issues with complicated data bindings, such as lambda and anonymous expressions.

#9

Hello @enchev
Hello @korchev

Would Radzen team have any suggestions?

#10

I will do further tests following your suggestion. After all, we now know where the cause of the conflict lies.

#11

The AllowColumnResize property really needs to be reviewed by the Radzen team.

Setting the Width property on columns or the grid causes strange behavior.