AutoComplete Tag Helper Overview
The AutoComplete tag helper helps you configure the Kendo UI AutoComplete widget in ASP.NET Core applications.
Basic Usage
The following example demonstrates how to define the AutoComplete by using the AutoComplete tag helper.
Example
<kendo-autocomplete name="products" filter="FilterType.StartsWith"></kendo-autocomplete>
Configuration
The AutoComplete tag helper configuration options are passed as attributes of the tag.
@(Html.Kendo().AutoComplete()
.Name("products2")
.DataTextField("ProductName")
.Filter("contains")
.MinLength(3)
.HtmlAttributes(new { style = "width:100%" })
.DataSource(source =>
{
source
.Read(read =>
{
read.Action("GetProducts", "Home")
.Data("onAdditionalData");
})
.ServerFiltering(true);
})
)
<script>
function onAdditionalData() {
return {
text: $("#products").val()
};
}
</script>
<kendo-autocomplete name="products" filter="FilterType.Contains"
datatextfield="ProductName"
min-length="3" style="width: 100%;">
<datasource type="DataSourceTagHelperType.Custom" server-filtering="true">
<transport>
<read url="@Url.Action("GetProducts", "Home")" data="onAdditionalData" />
</transport>
</datasource>
</kendo-autocomplete>
<script>
function onAdditionalData() {
return {
text: $("#products").val()
};
}
</script>