New to Telerik UI for ASP.NET MVC? Download free 30-day trial

Events

The Telerik UI AutoComplete for ASP.NET MVC exposes multiple events that allow you to control and customize the behavior of the component.

For a complete example of the basic AutoComplete events, refer to the demo on using the events of the AutoComplete.

Handling by Handler Name

The following example demonstrates how to subscribe to events by a handler name.

    @(Html.Kendo().AutoComplete()
        .Name("autocomplete")
        .DataTextField("Text")
        .DataValueField("Value")
        .BindTo(new List<SelectListItem>() {
            new SelectListItem() {
                Text = "Item1", Value = "1"
            },
            new SelectListItem() {
                Text = "Item2", Value = "2"
            },
            new SelectListItem() {
                Text = "Item3", Value = "3"
            }
        })
        .Events(e => e
            .Select("onSelect")
            .Change("onChange")
        )
    )
    <script>
        function onSelect() {
            // Handle the select event.
        }

        function onChange() {
            // Handle the change event.
        }
    </script>

Handling by Template Delegate

The following example demonstrates how to subscribe to events by a template delegate.

    @(Html.Kendo().AutoComplete()
        .Name("autocomplete")
        .DataTextField("Text")
        .DataValueField("Value")
        .BindTo(new List<SelectListItem>() {
            new SelectListItem() {
                Text = "Item1", Value = "1"
            },
            new SelectListItem() {
                Text = "Item2", Value = "2"
            },
            new SelectListItem() {
                Text = "Item3", Value = "3"
            }
        })
        .Events(e => e
            .Select(@<text>
                function() {
                    // Handle the select event inline.
                }
            </text>)
            .Change(@<text>
                function() {
                    // Handle the change event inline.
                }
            </text>)
        )
    )

Next Steps

See Also

In this article