DropDownTreeTagHelper

Example

Razor
<kendo-dropdowntree>
    <check-all-template></check-all-template>
    <checkboxes></checkboxes>
    <footer-template></footer-template>
    <header-template></header-template>
    <hierarchical-datasource></hierarchical-datasource>
    <items></items>
    <item-template></item-template>
    <label />
    <load-on-demand />
    <messages />
    <no-data-template></no-data-template>
    <popup></popup>
    <popup-animation></popup-animation>
    <value-template></value-template>
</kendo-dropdowntree>

ChildTags

Attributes

AttributeTypeDescription
nameStringSets the name of the component.
adaptive-modeAdaptiveModeSpecifies the adaptive rendering of the component.
as-moduleBoolean
auto-bindBooleanControls whether to bind the widget to the data source on initialization.
auto-closeBooleanControls whether to close the popup when item is selected or checked.
auto-widthBooleanIf set to true, the widget automatically adjusts the width of the popup element and does not wrap up the item label.
bind-toIEnumerable<DropDownTreeItemModel>Binds a list of items to the DropDownTree.
check-allBooleanWhen this options is set to true and checkboxes are enabled, a tristate checkbox appears above the embedded treeview. Clicking that checkbox will check or uncheck all the loaded enabled items of the treeview.
check-all-templateStringThe template used to render the checkAll label. By default, the widget displays only a span element with text "Check all".
check-all-template-handlerStringThe template used to render the checkAll label. By default, the widget displays only a span element with text "Check all".
check-all-template-idStringThe template used to render the checkAll label. By default, the widget displays only a span element with text "Check all".
check-all-template-viewIHtmlContentThe template used to render the checkAll label. By default, the widget displays only a span element with text "Check all".
checkboxes-enabledBooleanIndicates whether the child DataSources should be fetched lazily when parent groups get expanded. Setting this to true causes loading the child DataSources when expanding the parent node.
clear-buttonBooleanUnless this option is set to false, a button will appear when hovering the widget. Clicking that button will reset the widget's value and will trigger the change event.
data-image-url-fieldStringSets the field of the data item that provides the image URL of the DropDownTree nodes.
data-source-idStringThe Id of the data source.
data-sprite-css-class-fieldStringSets the field of the data item that provides the sprite CSS class of the nodes. If an array, each level uses the field that is at the same index in the array, or the last item in the array.
data-text-fieldStringThe field of the data item that provides the text content of the list items. The widget will filter the data source based on this field.
data-url-fieldStringSets the field of the data item that provides the link URL of the nodes.
data-value-fieldStringThe field of the data item that provides the value of the widget.
delayDoubleSpecifies the delay in milliseconds after which the DropDownTree will start filtering dataSource.
enableBooleanIf set to false the widget will be disabled and will not allow user input. The widget is enabled by default and allows user input.
enforce-min-lengthBooleanIf set to true the widget will not show all items when the text of the search input cleared. By default, the widget shows all items when the text of the search input is cleared. Works in conjunction with minLength.
fill-modeFillModeSets a value controlling how the color is applied.
filterFilterTypeWhen filtering is enabled, allows aria-label to be defined for the filter input element.
filter-labelStringWhen filtering is enabled, allows aria-label to be defined for the filter input element.
footer-templateStringThe template used to render the footer template. The footer template receives the widget itself as a part of the data argument. Use the widget fields directly in the template.
footer-template-handlerStringThe template used to render the footer template. The footer template receives the widget itself as a part of the data argument. Use the widget fields directly in the template.
forModelExpressionAn expression to be evaluated against the current model.
is-in-client-templateBooleanWhen placing a Tag Helper within a Kendo Template, set the type to text/html and add the is-in-client-template="true" attribute.
deferredBooleanSuppress initialization script rendering. Note that this options should be used in conjunction with DeferredScripts method.
footer-template-idStringThe template used to render the footer template. The footer template receives the widget itself as a part of the data argument. Use the widget fields directly in the template.
footer-template-viewIHtmlContentThe template used to render the footer template. The footer template receives the widget itself as a part of the data argument. Use the widget fields directly in the template.
has-client-componentBoolean
header-templateStringSpecifies a static HTML content, which will be rendered as a header of the popup element.
header-template-handlerStringSpecifies a static HTML content, which will be rendered as a header of the popup element.
header-template-idStringSpecifies a static HTML content, which will be rendered as a header of the popup element.
header-template-viewIHtmlContentSpecifies a static HTML content, which will be rendered as a header of the popup element.
heightStringSets max-height of the embedded treeview in pixels. The default value is 200 pixels. If set to "Auto" the height of the popup will depend on the height of the treeview.
ignore-caseBooleanIf set to false case-sensitive search will be performed to find suggestions. The widget performs case-insensitive searching by default.
load-on-demand-enabledBooleanIndicates whether the child DataSources should be fetched lazily when parent groups get expanded. Setting this to true causes loading the child DataSources when expanding the parent node.
min-lengthDoubleThe minimum number of characters the user must type before a search is performed. Set to a higher value if the search could match a lot of items.
no-data-templateStringThe template used to render the "no data" template, which will be displayed if no results are found or the underlying data source is empty. The noData template receives the widget itself as a part of the data argument. The template will be evaluated on every widget data bound.
no-data-template-handlerStringThe template used to render the "no data" template, which will be displayed if no results are found or the underlying data source is empty. The noData template receives the widget itself as a part of the data argument. The template will be evaluated on every widget data bound.
no-data-template-idStringThe template used to render the "no data" template, which will be displayed if no results are found or the underlying data source is empty. The noData template receives the widget itself as a part of the data argument. The template will be evaluated on every widget data bound.
no-data-template-viewIHtmlContentThe template used to render the "no data" template, which will be displayed if no results are found or the underlying data source is empty. The noData template receives the widget itself as a part of the data argument. The template will be evaluated on every widget data bound.
on-changeStringFired when the value of the widget is changed by the user.The event handler function context (available via the this keyword) will be set to the widget instance.
on-closeStringFired when the popup of the widget is closed.The event handler function context (available via the this keyword) will be set to the widget instance.
on-data-boundStringFired when the widget or sub levels of its items are bound to data from the dataSource.The event handler function context (available via the this keyword) will be set to the widget instance.
on-filteringStringFired when the widget is about to filter the data source.The event handler function context (available via the this keyword) will be set to the widget instance.
on-openStringFired when the popup of the widget is opened by the user.The event handler function context (available via the this keyword) will be set to the widget instance.
on-selectStringTriggered when a node is being selected by the user. Cancellable. When checkboxes are enabled, it is also triggered when a node is being deselected.
placeholderStringThe hint displayed by the widget when it is empty. Not set by default.
roundedRoundedSets a value controlling the border radius.
sanitize-idBoolean
script-attributesIDictionary<String,Object>
sizeComponentSizeSets the size of the component.
tag-modeDropDownTreeTagModeRepresents available tag modes of DropDownTree.
templateStringTemplate for rendering each node.
template-handlerStringTemplate for rendering each node.
template-idStringTemplate for rendering each node.
template-viewIHtmlContentTemplate for rendering each node.
textStringThe text of the widget used when the autoBind is set to false.
valueObjectDefine the value of the widget. It accepts 'String' when it is in single selection mode and 'Array' when multiple selection is enabled via checkboxes property.
value-primitiveBooleanSpecifies the value binding behavior for the widget. If set to true, the View-Model field will be updated with the selected item value field. If set to false, the View-Model field will be updated with the selected item.
value-templateStringThe template used to render the value and the or the selected tags.
value-template-handlerStringThe template used to render the value and the or the selected tags.
value-template-idStringThe template used to render the value and the or the selected tags.
value-template-viewIHtmlContentThe template used to render the value and the or the selected tags.
In this article
ExampleChildTagsAttributes
Not finding the help you need?
Contact Support