Skip to content

kb(TreeView): Enhance filtering KB #2914

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Apr 16, 2025
Merged

kb(TreeView): Enhance filtering KB #2914

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 16 additions & 2 deletions knowledge-base/treeview-filtering.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ page_title: How to Filter or Search TreeView Items
slug: treeview-kb-filter-items
position:
tags: telerik, blazor, treeview, filter, search
ticketid: 1629723, 1468684, 1547890, 1578053, 1541792
ticketid: 1684940, 1629723, 1468684, 1547890, 1578053, 1541792
res_type: kb
---

Expand Down Expand Up @@ -49,6 +49,7 @@ In both scenarios, there should be no [loading of TreeView items on demand](slug
* If you need more complex filtering logic, use one or more [`CompositeFilterDescriptor`](slug:Telerik.DataSource.CompositeFilterDescriptor)s.
1. Execute the [`ToDataSourceResult()` extension method](slug:common-features-data-binding-onread#todatasourceresult-method) on the TreeView `Data`. You will need to import the [`Telerik.DataSource.Extensions` namespace](slug:Telerik.DataSource.Extensions).
1. (optional) Add any missing parent items to the filtered items collection.
1. (optional) Set the [TreeView `ExpandedItems` parameter to expand or collapse the parent TreeView items](slug:treeview-expand-items) after filtering.
1. (optional) Use a [TreeView `ItemTemplate`](slug:components/treeview/templates) to highlight the search string inside the displayed TreeView items.

>tip If the filtering operator is fixed (for example, `Contains`), you can replace steps 4 and 5 with a standard LINQ expression:
Expand Down Expand Up @@ -76,6 +77,11 @@ In both scenarios, there should be no [loading of TreeView items on demand](slug
ValueChanged="@TreeViewFilterOperatorChanged"
Width="180px" />

<label class="k-checkbox-label">
<TelerikCheckBox @bind-Value="@ShouldExpandFilteredItems" />
Expand Filter Results
</label>

<p>@FilterLog</p>

<TelerikTreeView Data="@FilteredData" @bind-ExpandedItems="@ExpandedItems">
Expand Down Expand Up @@ -122,6 +128,7 @@ In both scenarios, there should be no [loading of TreeView items on demand](slug
private IEnumerable<object> ExpandedItems { get; set; } = new List<TreeItem>();

private string FilterLog { get; set; } = string.Empty;
private bool ShouldExpandFilteredItems { get; set; } = true;

#region Filtering Logic

Expand Down Expand Up @@ -160,6 +167,8 @@ In both scenarios, there should be no [loading of TreeView items on demand](slug
FilterLog = $"Showing all {FlatData.Count} items.";

FilteredData = FlatData;

ExpandedItems = FlatData.Where(x => x.ParentId is null);
}
}

Expand Down Expand Up @@ -195,6 +204,11 @@ In both scenarios, there should be no [loading of TreeView items on demand](slug
FilterLog = $"Found {matchCount} matches. Showing {filteredItems.Count} out of {FlatData.Count} items.";

FilteredData = filteredItems;

if (ShouldExpandFilteredItems)
{
ExpandedItems = FilteredData;
}
}

private void PopulateParent(int itemId, int? parentId, List<TreeItem> filteredItems, List<TreeItem> addedParents)
Expand Down Expand Up @@ -230,7 +244,7 @@ In both scenarios, there should be no [loading of TreeView items on demand](slug
{
FlatData = FilteredData = LoadFlat();

ExpandedItems = FlatData.Where(x => x.HasChildren == true);
ExpandedItems = FlatData.Where(x => x.ParentId is null);
}

private List<TreeItem> LoadFlat()
Expand Down
Loading