Combo Box for ASP.NET Web Forms - How to customize an item's appearance

This example demonstrates how to create a combo box editor and use its client-side functionality to specify the appearance of the editor's items.

Overview

Create a combo box editor and use its client-side GetSelectedIndex method to identify the editor’s selected item by its index. Call the editor's SetItemTooltip method to assign a tooltip to the specified item. To customize the item's style settings, use the editor's client-side AddItemCssClass and RemoveItemCssClass methods.

function onSelectedIndexChanged(sender, target) {
    if (sender.PrevIndex != undefined) {
        target.SetItemTooltip(sender.PrevIndex, "");
        target.RemoveItemCssClass(sender.PrevIndex, "MySelectedItem");
    }
    target.SetItemTooltip(sender.GetSelectedIndex(), "This item is selected in another combobox");
    target.AddItemCssClass(sender.GetSelectedIndex(), "MySelectedItem");
    sender.PrevIndex = sender.GetSelectedIndex();
}

<dx:ASPxComboBox ID="MyTestComboBox1" runat="server" ClientInstanceName="combo1">
    <Items>
        <!-- ... -->
    </Items>
    <ClientSideEvents SelectedIndexChanged="function (s, e) { onSelectedIndexChanged(s, combo2); }"
        Init="SetItemColor" EndCallback="SetItemColor" />
</dx:ASPxComboBox>
<dx:ASPxComboBox ID="MyTestComboBox2" runat="server" ClientInstanceName="combo2">
    <Items>
        <!-- ... -->
    </Items>
    <ClientSideEvents SelectedIndexChanged="function (s, e) { onSelectedIndexChanged(s, combo1); }"
        Init="SetItemColor" EndCallback="SetItemColor" />
</dx:ASPxComboBox>

Files to Review

• Default.aspx (VB: Default.aspx)
• Default.aspx.cs (VB: Default.aspx.vb)

Does this example address your development requirements/objectives?

(you will be redirected to DevExpress.com to submit your response)