AutoComplete

Example

Razor
<kendo-autocomplete>
    <datasource></datasource>
    <fixed-group-template></fixed-group-template>
    <footer-template></footer-template>
    <group-template></group-template>
    <header-template></header-template>
    <item-template></item-template>
    <label />
    <messages />
    <no-data-template></no-data-template>
    <popup></popup>
    <popup-animation></popup-animation>
    <prefix-options></prefix-options>
    <suffix-options></suffix-options>
    <virtual />
</kendo-autocomplete>

ChildTags

Attributes

AttributeTypeDescription
nameStringSets the name of the component.
adaptive-modeAdaptiveModeSpecifies the adaptive rendering of the component.
as-moduleBoolean
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<Object>The collection of data items which the data source contains.
clear-buttonBooleanUnless this options 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.
datasource-idStringThe data source id
data-text-fieldStringThe field of the data item used when searching for suggestions. This is the text that will be displayed in the list of matched results.
delayDoubleThe delay in milliseconds between a keystroke and when the widget displays the suggestion popup.
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.
filterFilterTypeThe filtering method used to determine the suggestions for the current value.
fixed-group-templateStringThe template used to render the fixed header group. By default the widget displays only the value of the current group.
fixed-group-template-handlerStringThe template used to render the fixed header group. By default the widget displays only the value of the current group.
fixed-group-template-idStringThe template used to render the fixed header group. By default the widget displays only the value of the current group.
fixed-group-template-viewIHtmlContentThe template used to render the fixed header group. By default the widget displays only the value of the current group.
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.
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.
deferredBooleanSuppress initialization script rendering. Note that this options should be used in conjunction with DeferredScripts method.
group-templateStringThe template used to render the groups. By default the widget displays only the value of the group.
group-template-handlerStringThe template used to render the groups. By default the widget displays only the value of the group.
group-template-idStringThe template used to render the groups. By default the widget displays only the value of the group.
group-template-viewIHtmlContentThe template used to render the groups. By default the widget displays only the value of the group.
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.
forModelExpressionAn expression to be evaluated against the current model.
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.
heightDoubleThe height of the suggestion popup in pixels. The default value is 200 pixels.
highlight-firstBooleanIf set to true the first suggestion will be automatically highlighted.
ignore-caseBooleanIf set to false case-sensitive search will be performed to find suggestions. The widget performs case-insensitive searching by default.
input-modeStringSpecifies the inputmode attribute of the inner <input /> element. It is used to specify the type of on-screen keyboard that should be displayed when the user focuses the input.
min-lengthDoubleThe minimum number of characters the user must type before a search is performed. Set to higher value than 1 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 through the keyword this) will be set to the widget instance.
on-closeStringFired when the suggestion popup of the widget is closed by the user.The event handler function context (available through the keyword this) will be set to the widget instance.
on-data-boundStringFired when the widget is bound to data from its data source.The event handler function context (available through the keyword this) 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 through the keyword this) will be set to the widget instance.
on-openStringFired when the suggestion popup of the widget is opened by the user.The event handler function context (available through the keyword this) will be set to the widget instance.
on-selectStringFired when an item from the suggestion popup is selected by the user.
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>
separatorStringThe character used to separate multiple values. Empty by default.
sizeComponentSizeSets the size of the component.
suggestBooleanIf set to true the widget will automatically use the first suggestion as its value.
templateStringThe template used to render the suggestions. By default the widget displays only the text of the suggestion (configured via dataTextField).
template-handlerStringThe template used to render the suggestions. By default the widget displays only the text of the suggestion (configured via dataTextField).
template-idStringThe template used to render the suggestions. By default the widget displays only the text of the suggestion (configured via dataTextField).
template-viewIHtmlContentThe template used to render the suggestions. By default the widget displays only the text of the suggestion (configured via dataTextField).
valueStringThe value of the widget.
value-primitiveBooleanSpecifies the value binding behavior for the widget when the initial model value is null. If set to true, the View-Model field will be updated with the selected item text field. If set to false, the View-Model field will be updated with the selected item.
In this article
ExampleChildTagsAttributes
Not finding the help you need?
Contact Support