Manchmal reicht eine Spalte nicht, um einen Eintrag zu erkennen. MultiColumnComboBox zeigt mehrere Spalten mit Kopfzeile und durchsucht alle.
Warum es hilft
- Mehrere Spalten in der Liste
- Tippen durchsucht jede Spalte
- Aufbauend auf Autocomplete
Wo es passt
- Kunden mit Ort und ID
- Produkte mit Code und Preis
- Mitarbeiter mit Abteilung
Beispiel
<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")
];
}Ein kurzes Fragment. Fügen Sie @using RayCraft.Blazor.Components zu Ihrer Seite hinzu und nutzen Sie einen interaktiven Render-Modus.
In RayCraft Free enthalten. Funktionierende Beispiele finden Sie im GitHub-Repository (MIT); es enthält Beispiel- und Democode, nicht den Code der Bibliothek.