RadComboBox for ASP.NET AJAX

Contents
RadControls Send comments on this topic.
Templates Overview
See Also
Controls > RadComboBox > Templates > Templates Overview

Glossary Item Box

RadComboBox fully supports templates. If you do not specify an ItemTemplate, all items are rendered using their Text property as plain text. If you specify an ItemTemplate, then the respective template is used for rendering.You can embed any content inside a template:

  • HTML markup
  • ASP.NET server controls
  • other third-party controls (other Telerik RadControls for ASP.NET as well) 
Templates will not work when the combobox items are added via a WebService

In design time, add item templates to your RadComboBox control using the Template Design Surface. RadComboBox supports global template which affects the appearance of all items in the control.

Example

Shows how to use templates to create the following combobox:

An <ItemTemplate> section is added to the RadComboBox declaration. The image in the template and the text that appears in the template is taken from the RadComboBoxItem using <%# DataBinder.Eval %> statements:

[ASP.NET] Declaratively using attributes in an item template Copy Code
<telerik:RadComboBox
     ID="RadComboBox1"
     MarkFirstMatch="True"
     runat="server"
     Height="190px"
     Width="350px"
     Skin="Default"
     AutoPostBack="False"
     HighlightTemplatedItems="True"
     ShowToggleImage="True">
 <ItemTemplate>
  <table style="border-bottom: 1px dotted #EFEFEF; margin-bottom: 10px; font-size: 11px;" width="98%">
    <tr>
      <td>
        <img src='Img/<%# DataBinder.Eval(Container, "Attributes['ImagePath']") %>' alt="" />
      </td>
      <td>
        <%# DataBinder.Eval(Container, "Attributes['DisplayName']") %>
        (<%# DataBinder.Eval(Container, "Text") %>)
      </td>
    </tr>
  </table>
</ItemTemplate>
<Items>
  <telerik:RadComboBoxItem
    ImagePath="pic1.gif"
    DisplayName="Pic1.gif | Size: 2,134 Kb | Last Mofified: 01/11/2005"
    Text="Winter">
  </telerik:RadComboBoxItem>
  <telerik:RadComboBoxItem
    ImagePath="pic2.gif"
    DisplayName="Pic2.gif | Size: 2,134 Kb | Last Mofified: 01/11/2005"
    Text="Fall">
  </telerik:RadComboBoxItem>
  <telerik:RadComboBoxItem
    ImagePath="pic3.gif"
    DisplayName="Pic3.gif | Size: 2,134 Kb | Last Mofified: 01/11/2005"
    Text="Spring">
  </telerik:RadComboBoxItem>
  <telerik:RadComboBoxItem
    ImagePath="pic4.gif"
    DisplayName="Pic4.gif | Size: 2,134 Kb | Last Mofified: 01/11/2005"
     Text="Summer">
  </telerik:RadComboBoxItem>
</Items>
</telerik:RadComboBox>

Before the template can use the combobox item properties to bind the elements in the template, the application needs to explicitly bind the items by calling the DataBind method of the RadComboBoxItem objects: 

[C#] Binding the items Copy Code
protected void Page_Load(object sender, EventArgs e)
{
  for (int i = 0; i < RadComboBox1.Items.Count; i++)
  {
     RadComboBox1.Items[i].DataBind();
  }      
}
[VB] Binding the items Copy Code
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
  Dim i As Integer = 0
  While i < RadComboBox1.Items.Count
   RadComboBox1.Items(i).DataBind()
   i = i + 1
  End While
End Sub

Here is the same combo box without the template:

See Also