TreeSelect
Tree selection control.
When To Use
TreeSelect
is similar to Select
, but the values are provided in a tree like structure. Any data whose entries are defined in a hierarchical manner is fit to use this control. Examples of such case may include a corporate hierarchy, a directory structure, and so on.
Examples
TreeSelect API#
Property | Description | Type | Default Value |
---|---|---|---|
Multiple | ParameterWhether to allow multiple selections or not | Boolean | false unless TreeCheckable is true |
TreeCheckable | ParameterWhether tree nodes are able to be selected or not, which would select all leafs under that node. | Boolean | false |
TreeCheckStrictly | ParameterCheck treeNode precisely; parent treeNode and children treeNodes are not associated | Boolean | -- |
ShowCheckedStrategy | ParameterSpecify how to show checked values when TreeCheckable is true and TreeCheckStrictly is false | TreeCheckedStrategy | -- |
CheckOnClickNode | ParameterWhether to check the checkbox when user click the tree node. | Boolean | -- |
OnBlur | ParameterCallback executed when the component looses focus | Action | -- |
TitleTemplate | ParameterGet or set the template to render the title of the tree node | RenderFragment<TreeNode<TItem>> | -- |
TitleIconTemplate | ParameterCustomize the icon templates | RenderFragment<TreeNode<TItem>> | -- |
Nodes | ParameterNodes to render in the tree. Use either this or AntDesign.TreeSelect`2.DataSource |
TreeNode`1[] | -- |
DataSource | ParameterDatasource for the tree. Can be a list of any custom object type by providing the expressions to get children, leafs, titles, etc. Use either this or AntDesign.TreeSelect`2.ChildContent |
IEnumerable<TItem> | -- |
ChildContent | ParameterUse this to set the content of the tree. Use either this or AntDesign.TreeSelect`2.DataSource |
RenderFragment | -- |
TreeDefaultExpandAll | ParameterWhether to expand all nodes by default | Boolean | -- |
TreeDefaultExpandParent | ParameterWhether to expand parent nodes by default | Boolean | -- |
TreeDefaultExpandedKeys | ParameterSet the keys of the default expanded tree nodes | String[] | -- |
ExpandOnClickNode | ParameterWhether to expand the parent node when clicking on a tree node | Boolean | -- |
SearchExpression | ParameterFunction used to indicate if a node matches the search | Func<TreeNode<TItem>, Boolean> | -- |
OnSearch | ParameterCallback executed when the user searches for a value | EventCallback<String> | -- |
MatchedStyle | ParameterSet the style of the matched text | String | -- |
MatchedClass | ParameterSet the class of the matched text | String | -- |
RootValue | ParameterThe value of the root node | String | 0 |
DropdownMatchSelectWidth | ParameterDetermine whether the dropdown menu and the select input are the same width. Default set min-width same as input. Will ignore when value less than select width. false will disable virtual scroll | OneOf<Boolean, String> | -- |
DropdownMaxWidth | ParameterMaximum width of the dropdown | String | auto |
PopupContainerMaxHeight | ParameterMaximum height of the dropdown | String | 256px |
ShowIcon | Parametershow treeNode icon icon | Boolean | -- |
ShowLeafIcon | ParameterWhether to show leaf icon | Boolean | -- |
TreeAttributes | ParameterSet the attributes of the tree | IDictionary<String, Object> | -- |
OnNodeLoadDelayAsync | ParameterCallback executed when the tree node is loaded | EventCallback<TreeEventArgs<TItem>> | -- |
OnTreeNodeSelect | ParameterCallback executed when the tree node is selected | EventCallback<TreeEventArgs<TItem>> | -- |
TitleExpression | ParameterSpecifies a method that returns the text of the node. | Func<TreeNode<TItem>, String> | -- |
DropdownStyle | ParameterSet the style of the dropdown menu | String | -- |
ShowTreeLine | ParameterWhether to show lines in the tree or not | Boolean | false |
KeyExpression | ParameterSpecifies a method that returns the key of the node. | Func<TreeNode<TItem>, String> | -- |
IconExpression | ParameterSpecifies a method to return the node icon. | Func<TreeNode<TItem>, String> | -- |
IsLeafExpression | ParameterSpecifies a method that returns whether the expression is a leaf node. | Func<TreeNode<TItem>, Boolean> | -- |
ChildrenExpression | ParameterSpecifies a method to return the children of a node | Func<TreeNode<TItem>, IEnumerable<TItem>> | -- |
DisabledExpression | ParameterSpecifies a method to return a disabled node | Func<TreeNode<TItem>, Boolean> | -- |
CheckableExpression | ParameterSpecifies a method to return a checkable node | Func<TreeNode<TItem>, Boolean> | -- |
ExpandedKeys | Parameter(Controlled) expands the specified tree node | String[] | -- |
Value | ParameterThe selected value | TItemValue | -- |
Values | ParameterThe selected values | IEnumerable<TItemValue> | -- |
BoundaryAdjustMode | ParameterOverlay adjustment strategy (when for example browser resize is happening) | TriggerBoundaryAdjustMode | -- |
AllowClear | ParameterShow clear button. Has no effect if AntDesign.AntInputComponentBase`1.Value type default is also in the list of SelectOption , unless used with AntDesign.SelectBase`2.ValueOnClear . |
Boolean | -- |
AutoClearSearchValue | ParameterWhether the current search will be cleared on selecting an item. | Boolean | -- |
Disabled | ParameterWhether the Select component is disabled. | Boolean | -- |
Mode | ParameterSet mode of Select - default | multiple | tags | String | -- |
EnableSearch | ParameterIndicates whether the search function is active or not. Always true for mode tags. | Boolean | -- |
SearchDebounceMilliseconds | ParameterDelays the processing of the search input event until the user has stopped typing for a predetermined amount of time. Default to 250ms. | Int32 | -- |
Loading | ParameterShow loading indicator. You have to write the loading logic on your own. | Boolean | -- |
Open | ParameterControlled open state of dropdown. | Boolean | -- |
OpenChanged | ParameterCallback function that is called when open state changes. | EventCallback<Boolean> | -- |
Placeholder | ParameterPlaceholder of select. | String | -- |
OnFocus | ParameterCalled when focus. | EventCallback | -- |
AutoFocus | ParameterAuto focus. | Boolean | -- |
SortByGroup | ParameterThe name of the property to be used as a group indicator. If the value is set, the entries are displayed in groups. Use additional SortByGroup and SortByLabel. | SortDirection | -- |
SortByLabel | ParameterSort items by label value. None | Ascending | Descending | SortDirection | -- |
HideSelected | ParameterHides the selected items when they are selected. | Boolean | -- |
ValueChanged | ParameterUsed for the two-way binding. | EventCallback<TItemValue> | -- |
ValuesChanged | ParameterUsed for the two-way binding. | EventCallback<IEnumerable<TItemValue>> | -- |
SuffixIcon | ParameterThe custom suffix icon. | RenderFragment | -- |
PrefixIcon | ParameterThe custom prefix icon. | RenderFragment | -- |
AccessKey | ParameterThe accesskey global attribute. | String | -- |
DefaultValues | ParameterUsed when Mode = multiple | tags - The values are used during initialization and when pressing the Reset button within Forms. | IEnumerable<TItemValue> | -- |
OnClearSelected | ParameterCalled when the user clears the selection. | EventCallback | -- |
OnSelectedItemChanged | ParameterCalled when the selected item changes. | EventCallback<TItem> | -- |
OnSelectedItemsChanged | ParameterCalled when the selected items changes. | EventCallback<IEnumerable<TItem>> | -- |
CustomTagLabelToValue | ParameterConverts custom tag (a string) to TItemValue type. | Func<String, TItemValue> | -- |
SelectOptions | ParameterUsed for rendering select options manually. | RenderFragment | -- |
MaxTagTextLength | ParameterHow long (number of characters) a tag will be. Only for Mode = "multiple" or Mode = "tags" | Int32 | -- |
LabelInValue | ParameterWhether to embed label in value, turn the format of value from TItemValue to string (JSON) e.g. { "value": TItemValue, "label": "Label value" } | Boolean | -- |
MaxTagCount | ParameterMax tag count to show. responsive will cost render performance. | OneOf<Int32, ResponsiveTag> | -- |
ValueOnClear | ParameterWhen Clear button is pressed, Value will be set to whatever is set in ValueOnClear | TItemValue | -- |
ItemLabel | ParameterSpecifies the label property in the option object. If use this property, should not use AntDesign.SelectBase`2.LabelName |
Func<TItem, String> | -- |
ItemValue | ParameterSpecifies the value property in the option object. If use this property, should not use AntDesign.SelectBase`2.ValueName |
Func<TItem, TItemValue> | -- |
LabelName | ParameterThe name of the property to be used for the label. | String | -- |
ValueName | ParameterThe name of the property to be used for the value. | String | -- |
OnMouseEnter | ParameterCalled when mouse enter. | Action | -- |
OnMouseLeave | ParameterCalled when mouse leave. | Action | -- |
PopupContainerSelector | ParameterUse this to fix overlay problems e.g. #area | String | -- |
DropdownRender | ParameterCustomize dropdown content. The context is the original content. | RenderFragment<RenderFragment> | -- |
LabelTemplate | ParameterIs used to customize the label style. | RenderFragment<TItem> | -- |
MaxTagPlaceholder | ParameterPlaceholder for hidden tags. If used with ResponsiveTag.Responsive, implement your own handling logic. | RenderFragment<IEnumerable<TItem>> | -- |
ShowSearchIcon | ParameterWhether show search input in single mode. | Boolean | -- |
ShowArrowIcon | Parameter | Boolean | -- |
ValidationMessages | Validation messages for the FormItem | String[] | -- |
AdditionalAttributes | ParameterGets or sets a collection of additional attributes that will be applied to the created element. | IReadOnlyDictionary<String, Object> | -- |
ValueExpression | ParameterAn expression that identifies the bound value. | Expression<Func<TItemValue>> | -- |
ValuesExpression | ParameterAn expression that identifies the enumerable of bound values. | Expression<Func<IEnumerable<TItemValue>>> | -- |
Size | ParameterThe size of the input box. Note: in the context of a form, the `large` size is used. Available: `large` `default` `small` | String | AntSizeLDSType.Default |
CultureInfo | ParameterWhat Culture will be used when converting string to value and value to string Useful for InputNumber component. | CultureInfo | CultureInfo.CurrentCulture |
Id | ParameterID for the component's HTML | String | Uniquely Generated ID |
Class | ParameterSpecifies one or more class names for an DOM element. | String | -- |
Style | ParameterSpecifies an inline style for a DOM element. | String | -- |
RefBack | ParameterA ForwardRef instance. You can get a reference to the internal DOM by using AntDesign.ForwardRef.Current . |
ForwardRef | -- |
Method Signature | Return Type | Description |
---|---|---|
CheckAll() | void | Check all nodes |
UncheckAll() | void | Uncheck all nodes |