ListBox with multiple selection: Simple way databind Dictionary<string,bool>

Radzen.Blazor Components
1

Hi,

I'm new to Radzen. Maybe a simple question:

I have a Dictionary<string,bool> and I want to databind this Dictionary to a MultSelection Listbox with the functionality that when I select/deselct an Itme in the Listbox the corresponding bool value gets changed in the Dictionary<string,bool>

Is there a simple way?

Thanks a lot in advance.... Chris

2

Hi @ChrisOnMoon,

Are you using Radzen or the Radzen.Blazor components?

3

Hi just the components even if I have a full licence for Radzen...

4

At the moment I have something like:

<RadzenListBox style="border: 1px solid #dae9e2; height: 200px; width: 100%" Name="ListBoxUnifiedDistanceMatrixActivePV" AllowFiltering="true" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive" @bind-Value="Selected" Multiple="true" Data="@PUMonMLEngine.UnifiedDistanceMatrix.ActivePV.Keys.ToList()" Change="@(args => ChangeSelectedListBox(args))" ValueProperty="Value" TextProperty="Key" />

With:
Dictionary <string,int> PUMonMLEngine.UnifiedDistanceMatrix.ActivePV
IEnumerable Selected = new string[] { }

5

Using a Dictionary as the Value won't work but something like this should work:

 <RadzenListBox  @bind-Value="value" Data="@data" TextProperty="Key" Multiple="true" />
@code {
    IEnumerable<KeyValuePair<string, int>> value = new List<KeyValuePair<string, int>>();
    Dictionary<string, int> data = new Dictionary<string, int>()
    {
       {"One", 1},
       {"Two", 2},
       {"Three", 3}
    };
}

If this isn't viable you will have to handle the Change event and manually populate the dictionary using the Selected property.

1 Like
6

Hi thanks a lot - to be honest: Probably I'm just stupid. I didnt find a solution.

I've tried now many ways to do this simple thing:

  1. Having a list box populated with the keys of the dictionary <string,int>
  2. Selecting items in the listbox
  3. If an item "blabla" is selected or several items "blabla", "blablabla" are selected the corresponding dictionary item is set to "blabla",1 and "blablabla",1
  4. If an item "blabla" is deselected or several items "blabla", "blablabla" are deselected the corresponding dictionary item is set to "blabla",0 and "blablabla",0

Bye

7

I recommend using an IList for the value of the Value of the ListBox and IEnumerable for its Data. Then handle the Change event of the ListBox and sync your desired Dictionary<> with the contents of the IList which is the Value.

8

Hi - thanks. Thats what I've done and tried several times but having no success. (Crash)

What worked for me was using for the value and the data an IENumerable. Maybe there are smarter solutions, but the following works:

Dictionary<string,int> ActivePV

IEnumerable UnifiedDistanceMatrixActivePV;
IEnumerable UnifiedDistanceMatrixSelectedPV;

    private async System.Threading.Tasks.Task ListBoxSelectedPVChange(object value)
    {
        List<string> SelectedNames = ((IEnumerable<string>)value).ToList();
        foreach (string NamePV in ActivePV.Keys)
        {
            if (SelectedNames.Contains(NamePV))
                ActivePV[NamePV] = 1;
            else
                ActivePV[NamePV] = 0;
        }            
        await Task.CompletedTask;
    }