Represents a Telerik UI for Blazor DropDownTree component that allows users to select a single value from a hierarchical tree structure displayed in a dropdown. Provides features like filtering, load-on-demand, custom templates, and adaptive mobile layouts for optimal user experience across all devices.
Definition
Namespace:Telerik.Blazor.Components
Assembly:Telerik.Blazor.dll
Type Parameters:
TValue
The type of the selected value used for binding. Must match the type of the property specified in ValueField.
Syntax:
public class TelerikDropDownTree<TValue> : TelerikSelectBase<object, TValue>, IComponent, IHandleEvent, IHandleAfterRender, IDisposable, IPopupContainerInheritance: objectComponentBaseBaseComponentDataBoundComponent<object>TelerikSelectBase<object, TValue>TelerikDropDownTree<TValue>...
Implements:
Inherited Members
Properties
Creates a default placeholder item displayed when no value is selected, allowing users to understand the dropdown's purpose. The default text appears in the input area when Value is null or default. Example: "Select a category", "Choose location", "-- None --".
[Parameter]
public string? DefaultText { get; set; }The DropDownTree items have features that map to properties in the model. The container enables you to create DropDownTreeBinding tags and configure the mappings. Children: DropDownTreeBinding tags.
[Parameter]
public RenderFragment? DropDownTreeBindings { get; set; }Configures advanced dropdown popup behavior including animations, positioning, dimensions, and collision detection. Children: DropDownTreePopupSettings component with properties for animation duration, popup dimensions, and positioning options.
[Parameter]
public RenderFragment? DropDownTreeSettings { get; set; }Enables WebMCP tool registration for this DropDownTree.
When true, DropDownTree operations are exposed as tools discoverable by AI models through the browser.
Default value is false.
[Parameter]
public bool EnableWebMcpTools { get; set; }Defines the collection of currently expanded items in the DropDownTree hierarchy. Use to pre-expand specific branches when the dropdown opens or to track user expansion interactions. Supports two-way binding with ExpandedItemsChanged for state persistence.
[Parameter]
public IEnumerable<object> ExpandedItems { get; set; }Fires when the ExpandedItems collection changes due to user interaction with expand/collapse icons. Use for state persistence, synchronizing with parent components, or triggering load-on-demand operations.
[Parameter]
public EventCallback<IEnumerable<object>> ExpandedItemsChanged { get; set; }Controls the delay in milliseconds between when a user stops typing and when the filter operation executes. Prevents excessive filtering during rapid typing, improving performance with large hierarchical datasets. Recommended range: 100-300ms for optimal balance of responsiveness and performance.
[Parameter]
public int FilterDebounceDelay { get; set; }Controls how the dropdown filters tree items when Filterable is enabled. StartsWith filters items that begin with the user input - fastest and most intuitive. Contains searches anywhere within the text - best for finding items in large hierarchies.
[Parameter]
public StringFilterOperator FilterOperator { get; set; }Sets the placeholder text displayed in the filter input field when Filterable is enabled. Provides users with guidance on how to search through the tree hierarchy. Example: "Type to search...", "Filter items", "Search categories".
[Parameter]
public string? FilterPlaceholder { get; set; }Fires when the dropdown popup is about to close, regardless of whether a selection was made. Use for cleanup operations, saving draft selections, or analytics tracking. Set IsCancelled to true to prevent the dropdown from closing.
[Parameter]
public EventCallback<DropDownTreeCloseEventArgs> OnClose { get; set; }Fires when the user expands or collapses a tree node in the dropdown. Essential for implementing load-on-demand scenarios where child items are fetched when a node is expanded. The event provides the data item being expanded and its new expanded state.
[Parameter]
public EventCallback<DropDownTreeExpandEventArgs> OnExpand { get; set; }Fires when the dropdown component gains focus, either through user interaction or programmatically.
[Parameter]
public EventCallback OnFocus { get; set; }Fires when the user clicks, taps, or presses Enter on a tree item in the dropdown. Use for custom selection logic, navigation, or triggering additional actions beyond the default selection behavior.
[Parameter]
public EventCallback<DropDownTreeItemClickEventArgs> OnItemClick { get; set; }Executes custom logic when each tree item renders, allowing dynamic CSS class assignment based on item data. Use to highlight specific items, indicate status, apply conditional styling, or add accessibility attributes.
[Parameter]
public Action<DropDownTreeItemRenderEventArgs>? OnItemRender { get; set; }Fires when the dropdown popup is about to open, allowing you to cancel the operation or perform setup actions. Use for lazy loading tree data, logging user interactions, or preparing dynamic content. Set IsCancelled to true in the event handler to prevent the dropdown from opening.
[Parameter]
public EventCallback<DropDownTreeOpenEventArgs> OnOpen { get; set; }Fires when the dropdown needs to load data, enabling custom data operations like server-side filtering and load-on-demand. Once implemented, you must handle all data operations yourself - the component will no longer perform automatic filtering. Essential for large hierarchical datasets or integration with external APIs and databases.
[Parameter]
public EventCallback<DropDownTreeReadEventArgs> OnRead { get; set; }protected TreeViewItem? SelectedDataItem { get; set; }Controls whether a clear button (X icon) appears inside the input field for quick date removal. Clear button appears only when the component has a value - empty fields don't show the clear button.
[Parameter]
public bool ShowClearButton { get; set; }Customizes how the selected value appears in the dropdown input field using a custom template. Provides access to the selected data item for displaying formatted content, icons, or complex layouts. Example: Show category icon and name, display location with region info, or format hierarchical path. Children: allows arbitrary content including HTML elements, components, and data binding expressions.
[Parameter]
public RenderFragment<object>? ValueTemplate { get; set; }Methods
public void AddBinding(ITreeBinding binding)protected override void BuildRenderTree(RenderTreeBuilder __builder)Overrides:
public override void Dispose()Overrides:
GetBinding(int?)
ITreeBinding
public void RemoveBinding(ITreeBinding binding)