Completed
Last Updated: 28 Jan 2020 11:26 by ADMIN
Release 2.7.0
Gilles
Created on: 22 Jan 2020 13:14
Category: ComboBox
Type: Bug Report
4
Filtering ComboBox in a Window doesn't work in 2.6.1

Hi,

 

If I enter some characters in the ComboBox to filter it, the characters that I enter aren't shown and the filtering is not correct. Indeed, if I enter "ALU" (some of my data start with "ALU", no data appears.

3 comments
ADMIN
Marin Bratanov
Posted on: 23 Jan 2020 11:36

Thank you for the sample. Indeed, something goes wrong with the value and with the filter in this case.

I moved this to the Feedback portal so you can Follow its status: https://feedback.telerik.com/blazor/1450330-filtering-combobox-in-a-window-doesn-t-work-in-2-6-1

 

Regards,
Marin Bratanov
Progress Telerik

 UI for Blazor
Gilles
Posted on: 23 Jan 2020 08:33

Hi Marin,

 

in fact, the problem appears if the ComboBox is in a TelerikWindow. See code below to reproduce the behavior


@page "/"


<TelerikButton OnClick="@(() => IsPopupVisible = true)">Afficher Popup</TelerikButton>


<TelerikWindow Class="window" Visible="@IsPopupVisible" Modal="true" Centered="true" Width="400px" Height="400px">

    <WindowTitle>
        TEST
    </WindowTitle>

    <WindowContent>
        <TelerikComboBox Data="@ParentEntities" Value="@ParentEntityId" ValueChanged="@((args) => OnParentEntityChanged(args))" ValueExpression="@(() => this.ParentEntityId)"
                         TItem="ParentEntityDto" TValue="long?" ValueField="Id" TextField="Text" AllowCustom="false" ClearButton="true" Filterable="true" FilterOperator="@StringFilterOperator.Contains" />

        <TelerikComboBox Data="@Entities" @bind-Value="@EntityId" Enabled="@(this.ParentEntityId.HasValue)"
                         TItem="EntityDto" TValue="long?" ValueField="Id" TextField="Text" AllowCustom="false" ClearButton="true" Filterable="true" />
    </WindowContent>

    <WindowActions>
        <WindowAction Icon="@IconName.Close"></WindowAction>
    </WindowActions>

</TelerikWindow>



@code {
    private bool IsPopupVisible { get; set; } = false;
    public long? ParentEntityId { get; set; }
    public long? EntityId { get; set; }

    protected IList<ParentEntityDto> ParentEntities { get; set; } = GetParentEntities();
    protected IList<EntityDto> Entities { get; set; }

    protected Task OnParentEntityChanged(object o)
    {
        var parentEntityId = (long?)o;
        this.ParentEntityId = parentEntityId; // Necessary only if @bind-Value isn't used

        if (parentEntityId.HasValue)
        {
            this.Entities = GetEntities(parentEntityId);
        }
        else
        {
            this.Entities = new List<EntityDto>();
        }

        this.EntityId = null;
        this.StateHasChanged();

        return Task.CompletedTask;
    }

    private static IList<ParentEntityDto> GetParentEntities()
    {
        var parentEntities = new List<ParentEntityDto>();
        for (int i = 0; i < 50; i++)
        {
            string c = i.ToString();
            parentEntities.Add(new ParentEntityDto { Id = i + 1, Text = $"{c}{c}{c}{c} / ({i + 1})" });
        }
        return parentEntities;
    }

    private static IList<EntityDto> GetEntities(long? parentEntityId)
    {
        var entities = new List<EntityDto>();
        if (parentEntityId.HasValue)
        {
            entities.Add(new EntityDto { Id = 1, Text = "Entity 1", ParentEntityId = 1 });
            entities.Add(new EntityDto { Id = 2, Text = "Entity 2", ParentEntityId = 1 });
            entities.Add(new EntityDto { Id = 3, Text = "Entity 3", ParentEntityId = 2 });
            entities.Add(new EntityDto { Id = 4, Text = "Entity 4", ParentEntityId = 2 });
            return entities.Where(o => o.ParentEntityId == parentEntityId.Value).ToList();
        }

        return entities;
    }


    public class ParentEntityDto
    {
        public long Id { get; set; }
        public string Text { get; set; }
    }

    public class EntityDto
    {
        public long Id { get; set; }
        public string Text { get; set; }
        public long ParentEntityId { get; set; }
    }
}

ADMIN
Marin Bratanov
Posted on: 22 Jan 2020 13:19

Hello,

Could you compare against this demo to see whether there is a difference that causes the issue: https://demos.telerik.com/blazor-ui/combobox/filtering? With our latest release there is a filter operator parameter, and for the combo it defaults to Contains, and it is not case-sensitive.

Does the demo work for you? Can you show me some hardcoded data that does not work as expected so I can take a look?

 

Regards,
Marin Bratanov
Progress Telerik

 UI for Blazor