RadzenListBox Selection Not Working

Radzen.Blazor Components
1

Hello,

I am trying to use the new RadzenPickList component within a standalone Blazor WebAssembly project. I found that selecting items on the source never updates, even when moved to the target. I noticed that this component uses the RadzenListBox component internally, so have implemented a standalone version of the RadzenListBox and this doesn't allow selection of items when in multiple select mode.

I'm not sure if I am doing something wrong or maybe this component has a WebAssembly issue?

I have a minimal project that reproduces this but can't upload to here as a new user. Can I get this to you somehow?

Thanks
Ben

2

Following this up, if I set Multiple to false for the list box then selecting an entry causes an error to be thrown:

image
image1919×1039 110 KB

3

Make sure you use latest Radzen.Blazor. This was fixed earlier this week.

4

I've created this project today. The nuget version is:

<PackageReference Include="Radzen.Blazor" Version="4.28.9" />

5

Try to replicate the exception using our demos and post the code. It works as expected, at the moment:

image
image1920×1080 141 KB

6

Using your demos with the following code I get the issue:

<Radzen.Blazor.RadzenListBox Style="height:500px; width:100%;"
                             @bind-Value=@_selected
                             Data=@_source 
                             TextProperty="@nameof(OrderData.OrderName)" 
                             Multiple=true 
                             AllowClear=true
                             AllowFiltering=true
                             FilterAsYouType=true 
                             FilterCaseSensitivity=Radzen.FilterCaseSensitivity.CaseInsensitive />

@code {
    IEnumerable<OrderData>? _selected;

    IEnumerable<OrderData>? _source;

    protected override void OnInitialized()
    {
        _source = Enumerable.Range(1, 100)
                                  .Select(index => new OrderData
                                      {
                                          OrderId = Guid.NewGuid(),
                                          OrderName = $"Order {index}"
                                      });
    }

    internal class OrderData
    {
        public Guid OrderId { get; set; } = Guid.Empty;
        public string OrderName { get; set; } = default!;
    }
}
7

Here is what I see using this code:

image
image1920×1080 197 KB

Selection will not work however there are no exception:

image
image1920×1080 140 KB

If you want the same to work properly you can use ToList(), otherwise the enumerable will return every time items with different hash code:

image
image1920×1080 160 KB

image
image1920×1080 143 KB

8

Thanks for the ToList. That solves the multiple selection.

If you set Multiple to false like the below you will get the exception:

<Radzen.Blazor.RadzenListBox Style="height:500px; width:100%;"
                             @bind-Value=@_selected
                             Data=@_source 
                             TextProperty="@nameof(OrderData.OrderName)" 
                             Multiple=false 
                             AllowClear=true
                             AllowFiltering=true
                             FilterAsYouType=true 
                             FilterCaseSensitivity=Radzen.FilterCaseSensitivity.CaseInsensitive />

@code {
    IEnumerable<OrderData>? _selected;

    IEnumerable<OrderData>? _source;

    protected override void OnInitialized()
    {
        _source = Enumerable.Range(1, 100)
                                  .Select(index => new OrderData
                                      {
                                          OrderId = Guid.NewGuid(),
                                          OrderName = $"Order {index}"
                                      }).ToList();
    }

    internal class OrderData
    {
        public Guid OrderId { get; set; } = Guid.Empty;
        public string OrderName { get; set; } = default!;
    }
}
9

Of course you will get since @bind-Value will return single item, not enumerable.

10

Yes, sorry that's my mistake. Thanks for the quick responses.