Parfois une seule colonne ne suffit pas pour reconnaître un élément. MultiColumnComboBox affiche plusieurs colonnes avec une ligne d’en-tête et cherche dans toutes.
Pourquoi c’est utile
- Plusieurs colonnes dans la liste
- La saisie cherche dans chaque colonne
- Construit sur Autocomplete
Où il trouve sa place
- Clients avec ville et identifiant
- Produits avec code et prix
- Employés avec service
Exemple
<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")
];
}Un court fragment. Ajoutez @using RayCraft.Blazor.Components à votre page et utilisez un mode de rendu interactif.
Inclus dans RayCraft Free. Des exemples fonctionnels se trouvent dans le dépôt GitHub (MIT); il contient du code d’exemple et de démonstration, pas le code de la bibliothèque.