Kendo Ui Dropdownlist On Change To Trigger Event

I'm using Kendo UI for the first time and am having some difficulty triggering a function on my Kendo dropdownlist change. My goal here is to show different search fields depending

Solution 1:

@(Html.Kendo().DropDownList()
                    .DataTextField("Text")
                    .DataValueField("Value")
                    .BindTo(new List<SelectListItem>()
                    {
                        new SelectListItem()
                        {
                            Text = "All",
                            Value = "1"
                        },
                        new SelectListItem()
                        {
                            Text = "Customer",
                            Value = "2"
                        },
                        new SelectListItem()
                        {
                            Text = "Contact",
                            Value = "3"
                        },
                        new SelectListItem()
                        {
                            Text = "Service Employee",
                            Value = "4"
                        },
                        new SelectListItem()
                        {
                            Text = "Organization",
                            Value = "5"
                        },
                        new SelectListItem()
                        {
                            Text = "Employee",
                            Value = "6"
                        },
                        new SelectListItem()
                        {
                            Text = "Other",
                            Value = "7"
                        }
                    })
               .Name("SearchType")
               .Events(e => e.Change("OnSearchTypeChange"));

<script type="text/javascript">
function OnSearchTypeChange(e)
{
 //Do whatever you want to do
}
</script>

Solution 2:

Subscribe to the onSelect event and then get the selected item text. Below from kendo demo site.

functiononSelect(e) {
                    if ("kendoConsole"inwindow) {
                        var dataItem = this.dataItem(e.item.index());
                        kendoConsole.log("event :: select (" + dataItem.text + " : " + dataItem.value + ")" );
                    }
                };

Solution 3:

I use Kendo MVC and my dropdownlist code is:

@(Html.Kendo()
    .DropDownListFor(p=> p.SelectedItem)
    .BindTo((List<SelectListItem>)ViewBag.SelectedListItems)
    .Events(p => p.Change("function(e){list_change(e);}")
))

so in change func:

functionpersonType_Change(e) {
    var item = $('#SelectedItem').data("kendoDropDownList");

    //use item.value() and write your own codes

}

maybe can help someone :)