New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

WebForms ComboBox Overview

About RadComboBox for ASP.NET AJAX

The Telerik RadComboBox control allows you to render more than simple string values. From multi-column support to template support, anything you need in a drop-down can be rendered in RadComboBox. The control provides a rich set of advanced features which include: rich client-side API with a comprehensive set of events, load-on-demand mechanism, auto-complete, filtering, multi-column support, highly customizable appearance through skins, content template support and much more. All this flexibility comes packaged in a control that renders lightweight, semantic HTML for optimum page performance and SEO.

RadComboBox and 120+ other controls are part of UI for ASP.NET AJAX, a comprehensive toolset taking care of the common functionality of your application, while leaving you with more time to work on its business logic.

Key Features

  • Powerful databinding
  • Rich client-side API
  • AJAX-based load on demand
  • Powerful Auto complete
  • Search Engine Friendly
  • Expand Animations
  • Multicolumn mode combobox
  • Skinned Appearance
  • Custom Attributes
  • Template Support
  • Right to left support

More about RadComboBox for ASP.NET AJAX
  • DefaultCS.aspx
  • DefaultCS.aspx.cs
    • DefaultCS.aspx.cs
    • Territories.cs
  • styles.css
  • PaymentMethods.xml
<%@ Page AutoEventWireup="false" CodeFile="DefaultCS.aspx.cs" Inherits="ComboBox.Examples.Overview.DefaultCS"Language="c#"  %>

<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link rel="stylesheet" href="styles.css" type="text/css" />
</head>

<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />

    <div class="demo-container no-bg">
        <div class="order-conf">
            <ul>
                <li>
                    <telerik:RadComboBox RenderMode="Lightweight" ID="RadComboBoxProduct" runat="server" Height="200" Width="315" 
                        DropDownWidth="315" EmptyMessage="Choose a Product" HighlightTemplatedItems="true"
                        EnableLoadOnDemand="true" Filter="StartsWith" OnItemsRequested="RadComboBoxProduct_ItemsRequested"
                        Label="Product: " Skin="Office2010Silver">
                        <HeaderTemplate>
                            <table style="width: 275px" cellspacing="0" cellpadding="0">
                                <tr>
                                    <td style="width: 175px;">
                                        Product Name
                                    </td>
                                    <td style="width: 60px;">
                                        Quantity
                                    </td>
                                    <td style="width: 40px;">
                                        Price
                                    </td>
                                </tr>
                            </table>
                        </HeaderTemplate>
                        <ItemTemplate>
                            <table style="width: 275px" cellspacing="0" cellpadding="0">
                                <tr>
                                    <td style="width: 175px;">
                                        <%# DataBinder.Eval(Container, "Text")%>
                                    </td>
                                    <td style="width: 60px;">
                                        <%# DataBinder.Eval(Container, "Attributes['UnitsInStock']")%>
                                    </td>
                                    <td style="width: 40px;">
                                        <%# DataBinder.Eval(Container, "Attributes['UnitPrice']")%>
                                    </td>
                                </tr>
                            </table>
                        </ItemTemplate>
                    </telerik:RadComboBox>
                    <asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator1" ControlToValidate="RadComboBoxProduct"
                        Display="Dynamic" ErrorMessage="!" CssClass="validator">
                    </asp:RequiredFieldValidator>
                </li>
                <li>
                    <telerik:RadComboBox RenderMode="Lightweight" ID="RadComboBoxRegion" runat="server" Height="200" Width="315" 
                        EmptyMessage="Choose a Region" MarkFirstMatch="true" EnableLoadOnDemand="true"
                        Label="Region: " Skin="Office2010Silver">
                        <WebServiceSettings Path="Territories.asmx" Method="GetTerritories" />
                    </telerik:RadComboBox>
                    <asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator2" ControlToValidate="RadComboBoxRegion"
                        Display="Dynamic" ErrorMessage="!" CssClass="validator" />
                </li>
                <li>
                    <telerik:RadComboBox RenderMode="Lightweight" ID="RadComboBoxDealer" runat="server" Height="200" Width="315" 
                        Filter="Contains" MarkFirstMatch="true" ChangeTextOnKeyBoardNavigation="false"
                        DataSourceID="SqlDataSource1" DataTextField="CompanyName" DataValueField="SupplierID"
                        Label="Dealer: " Skin="Office2010Silver">
                    </telerik:RadComboBox>
                    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
                        SelectCommand="SELECT [SupplierID], [CompanyName] FROM [Suppliers] ORDER BY [CompanyName]">
                    </asp:SqlDataSource>
                </li>
                <li>
                    <telerik:RadComboBox RenderMode="Lightweight" ID="RadComboBoxPaymentMethod" runat="server" Width="315" 
                        Label="Payment Method:" Skin="Office2010Silver" />
                    <asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/ComboBox/Examples/Default/PaymentMethods.xml" />
                </li>
            </ul>
            <p class="buttons">
                <asp:Button ID="CheckoutButton" runat="server" Text="Checkout"
                    OnClick="CheckoutButton_Click" />
            </p>
        </div>

        <asp:PlaceHolder runat="server" ID="OrderTable" Visible="false">
            <table class="order-summary">
                <tbody>
                    <tr>
                        <th>Product:</th>
                        <td><asp:Label ID="LabelProductName" runat="server" /></td>
                    </tr>
                    <tr>
                        <th>Region:</th>
                        <td><asp:Label ID="LabelRegionName" runat="server" /></td>
                    </tr>
                    <tr>
                        <th>Dealer:</th>
                        <td><asp:Label ID="LabelDealerName" runat="server" /></td>
                    </tr>
                    <tr>
                        <th>Payment:</th>
                        <td><asp:Label ID="LabelPaymentMethodName" runat="server" /></td>
                    </tr>
                    <tr class="price-row">
                        <th>Price:</th>
                        <td><asp:Literal ID="LabelPriceValue" runat="server" /></td>
                    </tr>
                </tbody>
            </table>
        </asp:PlaceHolder>

    </div>



    </form>
</body>
</html>

Support & Learning Resources

Find Assistance