Noen ganger holder ikke én kolonne for å kjenne igjen et element. MultiColumnComboBox viser flere kolonner med en overskriftsrad og søker i alle.
Hvorfor det hjelper
- Flere kolonner i listen
- Å skrive søker i hver kolonne
- Bygget på Autocomplete
Hvor det passer
- Kunder med sted og id
- Produkter med kode og pris
- Ansatte med avdeling
Eksempel
<MultiColumnComboBox TItem="Person" Items="SampleData.People" Columns="_columns" ItemText="@(p => p.Name)" @bind-Value="_person" Label="Employee" Placeholder="Search by any column" />
<p>Chosen: @(_person?.Name ?? "none")</p>
@code {
private Person? _person;
private readonly IReadOnlyList<ComboColumn<Person>> _columns =
[
new("Name", p => p.Name, "10rem"),
new("Department", p => p.Department, "8rem"),
new("Age", p => p.Age, "4rem")
];
}Et kort utdrag. Legg til @using RayCraft.Blazor.Components på siden din, og bruk en interaktiv gjengivelsesmodus.
Inkludert i RayCraft Free. Fungerende eksempler finnes i GitHub-arkiv (MIT); det inneholder eksempel- og demokode, ikke bibliotekets kode.