Class RadzenTree

A hierarchical tree view component for displaying nested data structures with expand/collapse functionality. RadzenTree supports both inline item definition and data-binding for displaying file systems, organization charts, category hierarchies, or any tree-structured data. Organizes data in a parent-child hierarchy where items can be expanded to reveal children. Supports static definition declaring tree structure using nested RadzenTreeItem components, data binding to hierarchical data using RadzenTreeLevel components, single or multiple item selection with checkboxes, individual item or programmatic expand/collapse control, custom icons per item or data-bound icon properties, custom rendering templates for tree items, keyboard navigation (Arrow keys, Space/Enter, Home/End) for accessibility, and Change/Expand/selection events. For data binding, use RadzenTreeLevel to define how to render each hierarchy level from your data model. For checkbox selection, use AllowCheckBoxes and bind to CheckedValues.

Inheritance

object

ComponentBase

RadzenComponent

RadzenTree

Implements

IComponent

IHandleEvent

IHandleAfterRender

IDisposable

Inherited Members

RadzenComponent.OnMouseEnter()

RadzenComponent.OnMouseLeave()

RadzenComponent.OnContextMenu(MouseEventArgs)

RadzenComponent.GetCssClass()

RadzenComponent.GetId()

RadzenComponent.Debounce(Func<Task>, int)

RadzenComponent.OnAfterRenderAsync(bool)

RadzenComponent.RaiseContextMenu(MouseEventArgs)

RadzenComponent.RaiseMouseEnter()

RadzenComponent.AddContextMenu()

RadzenComponent.RaiseMouseLeave()

RadzenComponent.Dispose()

RadzenComponent.Attributes

RadzenComponent.Element

RadzenComponent.MouseEnter

RadzenComponent.MouseLeave

RadzenComponent.ContextMenu

RadzenComponent.Culture

RadzenComponent.DefaultCulture

RadzenComponent.Style

RadzenComponent.Visible

RadzenComponent.UniqueID

RadzenComponent.JSRuntime

RadzenComponent.IsJSRuntimeAvailable

RadzenComponent.Reference

RadzenComponent.CurrentStyle

ComponentBase.OnInitializedAsync()

ComponentBase.OnParametersSet()

ComponentBase.OnParametersSetAsync()

ComponentBase.StateHasChanged()

ComponentBase.ShouldRender()

ComponentBase.OnAfterRender(bool)

ComponentBase.InvokeAsync(Action)

ComponentBase.InvokeAsync(Func<Task>)

ComponentBase.DispatchExceptionAsync(Exception)

object.GetType()

object.MemberwiseClone()

object.ToString()

object.Equals(object)

object.Equals(object, object)

object.ReferenceEquals(object, object)

object.GetHashCode()

Namespace: Radzen.Blazor

Assembly: Radzen.Blazor.dll

Syntax

public class RadzenTree : RadzenComponent, IComponent, IHandleEvent, IHandleAfterRender, IDisposable

Examples

Static tree with inline items:

<RadzenTree>
    <RadzenTreeItem Text="Documents" Icon="folder">
        <RadzenTreeItem Text="Work" Icon="folder">
            <RadzenTreeItem Text="report.pdf" Icon="description" />
        </RadzenTreeItem>
        <RadzenTreeItem Text="Personal" Icon="folder">
            <RadzenTreeItem Text="photo.jpg" Icon="image" />
        </RadzenTreeItem>
    </RadzenTreeItem>
</RadzenTree>

Data-bound tree with selection:

<RadzenTree Data=@categories AllowCheckBoxes="true" @bind-CheckedValues=@selectedCategories Change=@OnChange>
    <RadzenTreeLevel TextProperty="Name" ChildrenProperty="Children" />
</RadzenTree>
@code {
    IEnumerable<object> selectedCategories;
    void OnChange(TreeEventArgs args) => Console.WriteLine($"Selected: {args.Text}");
}

Constructors

RadzenTree()

A hierarchical tree view component for displaying nested data structures with expand/collapse functionality. RadzenTree supports both inline item definition and data-binding for displaying file systems, organization charts, category hierarchies, or any tree-structured data. Organizes data in a parent-child hierarchy where items can be expanded to reveal children. Supports static definition declaring tree structure using nested RadzenTreeItem components, data binding to hierarchical data using RadzenTreeLevel components, single or multiple item selection with checkboxes, individual item or programmatic expand/collapse control, custom icons per item or data-bound icon properties, custom rendering templates for tree items, keyboard navigation (Arrow keys, Space/Enter, Home/End) for accessibility, and Change/Expand/selection events. For data binding, use RadzenTreeLevel to define how to render each hierarchy level from your data model. For checkbox selection, use AllowCheckBoxes and bind to CheckedValues.

Declaration

public RadzenTree()

Examples

Static tree with inline items:

<RadzenTree>
    <RadzenTreeItem Text="Documents" Icon="folder">
        <RadzenTreeItem Text="Work" Icon="folder">
            <RadzenTreeItem Text="report.pdf" Icon="description" />
        </RadzenTreeItem>
        <RadzenTreeItem Text="Personal" Icon="folder">
            <RadzenTreeItem Text="photo.jpg" Icon="image" />
        </RadzenTreeItem>
    </RadzenTreeItem>
</RadzenTree>

Data-bound tree with selection:

<RadzenTree Data=@categories AllowCheckBoxes="true" @bind-CheckedValues=@selectedCategories Change=@OnChange>
    <RadzenTreeLevel TextProperty="Name" ChildrenProperty="Children" />
</RadzenTree>
@code {
    IEnumerable<object> selectedCategories;
    void OnChange(TreeEventArgs args) => Console.WriteLine($"Selected: {args.Text}");
}

Properties

AllowCheckBoxes

Specifies whether RadzenTree displays check boxes. Set to false by default.

Declaration

[Parameter]
public bool AllowCheckBoxes { get; set; }

Property Value

Type	Description
bool	true if check boxes are displayed; otherwise, false.

AllowCheckChildren

Specifies what happens when a parent item is checked. If set to true checking parent items also checks all of its children.

Declaration

[Parameter]
public bool AllowCheckChildren { get; set; }

Property Value

Type	Description
bool

AllowCheckParents

Specifies what happens with a parent item when one of its children is checked. If set to true checking a child item will affect the checked state of its parents.

Declaration

[Parameter]
public bool AllowCheckParents { get; set; }

Property Value

Type	Description
bool

Change

A callback that will be invoked when the user selects an item.

Declaration

[Parameter]
public EventCallback<TreeEventArgs> Change { get; set; }

Property Value

Type	Description
EventCallback<TreeEventArgs>

Examples

<RadzenTree Change=@OnChange>
    <RadzenTreeItem Text="BMW">
        <RadzenTreeItem Text="M3" />
        <RadzenTreeItem Text="M5" />
    </RadzenTreeItem>
    <RadzenTreeItem Text="Audi">
        <RadzenTreeItem Text="RS4" />
        <RadzenTreeItem Text="RS6" />
    </RadzenTreeItem>
    <RadzenTreeItem Text="Mercedes">
        <RadzenTreeItem Text="C63 AMG" />
        <RadzenTreeItem Text="S63 AMG" />
    </RadzenTreeItem>
</RadzenTree>
@code {
  void OnChange(TreeEventArgs args) 
  {

  }
}

CheckedValues

Gets or sets the checked values. Use with @bind-CheckedValues to sync it with a property.

Declaration

[Parameter]
public IEnumerable<object> CheckedValues { get; set; }

Property Value

Type	Description
IEnumerable<object>

CheckedValuesChanged

A callback which will be invoked when CheckedValues changes.

Declaration

[Parameter]
public EventCallback<IEnumerable<object>> CheckedValuesChanged { get; set; }

Property Value

Type	Description
EventCallback<IEnumerable<object>>

ChildContent

Gets or sets the child content.

Declaration

[Parameter]
public RenderFragment ChildContent { get; set; }

Property Value

Type	Description
RenderFragment	The child content.

Collapse

A callback that will be invoked when the user collapse an item.

Declaration

[Parameter]
public EventCallback<TreeEventArgs> Collapse { get; set; }

Property Value

Type	Description
EventCallback<TreeEventArgs>

Data

Specifies the collection of data items which RadzenTree will create its items from.

Declaration

[Parameter]
public IEnumerable Data { get; set; }

Property Value

Type	Description
IEnumerable

Expand

A callback that will be invoked when the user expands an item.

Declaration

[Parameter]
public EventCallback<TreeExpandEventArgs> Expand { get; set; }

Property Value

Type	Description
EventCallback<TreeExpandEventArgs>

Examples

<RadzenTree Expand=@OnExpand>
    <RadzenTreeItem Text="BMW">
        <RadzenTreeItem Text="M3" />
        <RadzenTreeItem Text="M5" />
    </RadzenTreeItem>
    <RadzenTreeItem Text="Audi">
        <RadzenTreeItem Text="RS4" />
        <RadzenTreeItem Text="RS6" />
    </RadzenTreeItem>
    <RadzenTreeItem Text="Mercedes">
        <RadzenTreeItem Text="C63 AMG" />
        <RadzenTreeItem Text="S63 AMG" />
    </RadzenTreeItem>
</RadzenTree>
@code {
  void OnExpand(TreeExpandEventArgs args) 
  {

  }
}

ItemContentCssClass

Gets or sets the CSS classes added to the item content.

Declaration

[Parameter]
public string ItemContentCssClass { get; set; }

Property Value

Type	Description
string

ItemContextMenu

Gets or sets the context menu callback.

Declaration

[Parameter]
public EventCallback<TreeItemContextMenuEventArgs> ItemContextMenu { get; set; }

Property Value

Type	Description
EventCallback<TreeItemContextMenuEventArgs>	The context menu callback.

ItemIconCssClass

Gets or sets the CSS classes added to the item icon.

Declaration

[Parameter]
public string ItemIconCssClass { get; set; }

Property Value

Type	Description
string

ItemLabelCssClass

Gets or sets the CSS classes added to the item label.

Declaration

[Parameter]
public string ItemLabelCssClass { get; set; }

Property Value

Type	Description
string

ItemRender

A callback that will be invoked when item is rendered.

Declaration

[Parameter]
public Action<TreeItemRenderEventArgs> ItemRender { get; set; }

Property Value

Type	Description
Action<TreeItemRenderEventArgs>

SelectItemAriaLabel

Gets or sets the open button aria-label attribute.

Declaration

[Parameter]
public string SelectItemAriaLabel { get; set; }

Property Value

Type	Description
string

SingleExpand

Specifies whether siblings items are collapsed. Set to false by default.

Declaration

[Parameter]
public bool SingleExpand { get; set; }

Property Value

Type	Description
bool

Value

Specifies the selected value. Use with @bind-Value to sync it with a property.

Declaration

[Parameter]
public object Value { get; set; }

Property Value

Type	Description
object

ValueChanged

A callback which will be invoked when Value changes.

Declaration

[Parameter]
public EventCallback<object> ValueChanged { get; set; }

Property Value

Type	Description
EventCallback<object>

Methods

BuildRenderTree(RenderTreeBuilder)

A hierarchical tree view component for displaying nested data structures with expand/collapse functionality. RadzenTree supports both inline item definition and data-binding for displaying file systems, organization charts, category hierarchies, or any tree-structured data. Organizes data in a parent-child hierarchy where items can be expanded to reveal children. Supports static definition declaring tree structure using nested RadzenTreeItem components, data binding to hierarchical data using RadzenTreeLevel components, single or multiple item selection with checkboxes, individual item or programmatic expand/collapse control, custom icons per item or data-bound icon properties, custom rendering templates for tree items, keyboard navigation (Arrow keys, Space/Enter, Home/End) for accessibility, and Change/Expand/selection events. For data binding, use RadzenTreeLevel to define how to render each hierarchy level from your data model. For checkbox selection, use AllowCheckBoxes and bind to CheckedValues.

Declaration

protected override void BuildRenderTree(RenderTreeBuilder __builder)

Parameters

Type	Name	Description
RenderTreeBuilder	__builder

Overrides

ComponentBase.BuildRenderTree(RenderTreeBuilder)

ClearSelection()

Clear the current selection to allow re-selection by mouse click

Declaration

public void ClearSelection()

GetComponentCssClass()

Gets the component CSS class.

Declaration

protected override string GetComponentCssClass()

Returns

Type	Description
string

Overrides

RadzenComponent.GetComponentCssClass()

OnInitialized()

Called by the Blazor runtime.

Declaration

protected override void OnInitialized()

Overrides

RadzenComponent.OnInitialized()

Reload(RadzenTreeItem)

Forces the specified item or, if item is null, all items in the tree to be re-evaluated such that items lazily created via Expand are realised if the underlying data model has been changed from somewhere else.

Declaration

public Task Reload(RadzenTreeItem item = null)

Parameters

Type	Name	Description
RadzenTreeItem	item	The item to be reloaded or null to refresh the root nodes of the tree.

Returns

Type	Description
Task	A task to wait for the operation to complete.

SetParametersAsync(ParameterView)

Called by the Blazor runtime when parameters are set.

Declaration

public override Task SetParametersAsync(ParameterView parameters)

Parameters

Type	Name	Description
ParameterView	parameters	The parameters.

Returns

Type	Description
Task

Overrides

RadzenComponent.SetParametersAsync(ParameterView)

Implements

IComponent

IHandleEvent

IHandleAfterRender

IDisposable