Telerik UI for Windows 8 HTML

This article describes the events fired by RadDropDownList, their usage and most notable event arguments.

Event Name




Fires when the value of the RadDropDownList changes. The RadDropDownList control whose value has changed. The new value can be accessed through


Fires when the dropdown list of RadDropDownList is closed. The RadDropDownList control whose dropdown was closed.


Fires when the control is about to databind. The RadDropDownList control whose is about to be bound.


Fires immediately after the control is databound. The RadDropDownList control whose has been bound.


Fires when the dropdown list of RadDropDownList is shown. The RadDropDownList control whose dropdown has been opened.


Fires when an item is selected from the dropdown list. The RadDropDownList control in which an item has been selected.

e.item: The jQuery object which represents the selected item.

The following example shows how to use the select event to access information about the selected item:

RadDropDownList Definition Copy imageCopy
<span id="myDropDownList" data-win-control="Telerik.UI.RadDropDownList" data-win-options="{
            dataSource: [
                { Name: 'Item1', ID: 1 },
                { Name: 'Item2', ID: 2 },
                { Name: 'Item3', ID: 3 }
            dataTextField: 'Name',
            dataValueField: 'ID',
            onselect: Sample.Helpers.itemSelected
<span id="selection" style="color: #33ccff"></span>
Event Handler Copy imageCopy
WinJS.Namespace.define("Sample.Helpers", {
    itemSelected: WinJS.Utilities.markSupportedForProcessing(function (e) {
        var itemIndex = e.item.index();
        var dataItem =;
        document.getElementById("selection").innerText = "Selected: " + dataItem.Name;