trigger select event programmatically

Question

I have a kendoUI dropdownlist defined as follows:

 @(Html.Kendo().DropDownList()
                  .Name("EditGroupSelector")
                  .BindTo(Model.Groups)
                   .Events(
                    events => events
                        .Select("onEditGroupSelected")
                   )
            )

i understand that the select event does not get triggered when i call the api as follows:

editGroupSelector.select(0);

after selecting the first item manually, i wanted to trigger the select event manually:

editGroupSelector.trigger("select");//api calls dont trigger events -> trigger it manually

this calls the event, but inside the eventhandler, i dont have my event and thus cannot get the new selected value:

function onEditGroupSelected(e) {
    var nameOfGroup = e.item.text();//e.item does not exist when triggered manually
}

how can i trigger the event so that i can actually use "e.item" inside my event-handler?

Answer 1

jQuery trigger function has an optional parameter that are the arguments. You need to add it manually making it compatible with automatic invocation. You should add (at least) item.

Example:

If the id of your dropDownList is dropdownlist you can create the argument as follow:

dropDownList.select(3);
dropDownList.trigger("select",
        { item: $("li.k-state-selected", $("#dropdownlist-list")) }
);

NOTE: It's very important to note that the list decorator (open dropDownList) is not identified by the id that you defined (ex. dropdownlist) but the id followed by -list (Ex: dropdownlist-list). That's why jQuery selector is as $("li.k-state-selected", $("#dropdownlist-list")