New to Telerik UI for ASP.NET AJAX? Start a free 30-day trial
OnClientSelectedIndexChanged
The OnClientSelectedIndexChanged client-side event occurs immediately after the selected item has changed.
The event handler receives two parameters:
-
The instance of the combobox firing the event.
-
An eventArgs parameter containing the following method:
-
get_item returns the item that has just been selected.
-
get_domEvent() returns the DOM event object.
Use this event to respond to the newly selected item:
ASPNET
<script language="javascript" type="text/javascript">
function OnClientSelectedIndexChanged(sender, eventArgs) {
var item = eventArgs.get_item();
sender.set_text("You selected " + item.get_text());
}
</script>
<telerik:radcombobox
id="RadComboBox1"
runat="server"
onclientselectedindexchanged="OnClientSelectedIndexChanged">
</telerik:radcombobox>
Getting Old Value
The old selected item is available only in the OnClientSelectedIndexChanging event via the sender.get_selectedItem()
method.
To have the old item in the OnClientSelectedChanged event, we can add a reference to the ComboBox client-side object in an expando property.
ASPNET
<script lang="javascript" type="text/javascript">
function OnClientSelectedIndexChanging(sender, eventArgs) {
var oldItem = sender.get_selectedItem();
var newItem = eventArgs.get_item();
sender.__oldSelectedItem = oldItem;
}
function OnClientSelectedIndexChanged(sender, eventArgs) {
var oldItem = sender.__oldSelectedItem;
var newItem = eventArgs.get_item();
if (oldItem) {
alert("Selection Changed from "
+ oldItem.get_text() +
" to " +
newItem.get_text());
}
}
</script>
<telerik:RadComboBox ID="RadComboBox1" runat="server" RenderMode="Lightweight" OnClientSelectedIndexChanged="OnClientSelectedIndexChanged"
OnClientSelectedIndexChanging="OnClientSelectedIndexChanging">
<Items>
<telerik:RadComboBoxItem Text="Item 1" />
<telerik:RadComboBoxItem Text="Item 2" />
<telerik:RadComboBoxItem Text="Item 3" />
<telerik:RadComboBoxItem Text="Item 4" />
</Items>
</telerik:RadComboBox>