Trigger selection event programmatically
I have a kendoUI dropdown that is defined like this:
@(Html.Kendo().DropDownList()
.Name("EditGroupSelector")
.BindTo(Model.Groups)
.Events(
events => events
.Select("onEditGroupSelected")
)
)
I understand that the select event is not fired when I call the api like this:
editGroupSelector.select(0);
after manually selecting the first item, I wanted to trigger the select event manually:
editGroupSelector.trigger("select");//api calls dont trigger events -> trigger it manually
this raises the event, but inside the event handler I don't have my event and hence it is impossible to 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 an event so that i can use "e.item" inside my event handler?
source to share
The jQuery trigger
function has an optional parameter that is an argument. You need to add it manually for it to be compatible with automatic calling. You must add (at least) item
.
Example:
If id
yours dropDownList
is dropDownList
, you can create an argument like this:
dropDownList.select(3);
dropDownList.trigger("select",
{ item: $("li.k-state-selected", $("#dropdownlist-list")) }
);
NOTE. It is very important to note that the list
decorator (open dropDownList) is not identified id
which you have defined (for example dropDownList
) but id
then -list
(example:) dropdownlist-list
. Therefore jQuery selector is$("li.k-state-selected", $("#dropdownlist-list")
source to share