Table of Contents
  • Getting Started
  • EO.Pdf
  • EO.Web
    • Overview
    • Installation & Deployement
    • EO.Web ToolTip
    • EO.Web Rating
    • EO.Web Slider & RangeSlider
    • EO.Web ListBox
    • EO.Web ComboBox
    • EO.Web Captcha
    • EO.Web ASPX To PDF
    • EO.Web Slide
    • EO.Web Flyout
    • EO.Web EditableLabel
    • EO.Web ImageZoom
    • EO.Web Floater
    • EO.Web Downloader
    • EO.Web ColorPicker
    • EO.Web HTML Editor
    • EO.Web File Explorer
    • EO.Web SpellChecker
    • EO.Web Grid
    • EO.Web MaskedEdit
    • EO.Web Splitter
    • EO.Web Menu
    • EO.Web Slide Menu
    • EO.Web TabStrip
    • EO.Web TreeView
    • EO.Web Calendar
    • EO.Web Callback
    • EO.Web MultiPage
    • EO.Web Dialog
    • EO.Web AJAXUploader
    • EO.Web ProgressBar - Free!
    • EO.Web ToolBar - Free!
  • EO.WebBrowser
  • EO.Wpf
  • Common Topics
  • Reference
Configure DropDown Template

EO.Web ComboBox does not have a built-in drop down list. You must provide a drop down list through the ComboBox's DropDownTemplate.

Using EO.Web ListBox In DropDownTemplate

The easiest way to create a drop down list is to place an EO.Web ListBox control inside the DropDownTemplate:

ASPX
<eo:ComboBox ....>
    ....
    <DropDownTemplate>
        <eo:ListBox ....>
            ....
        </eo:ListBox>
    </DropDownTemplate>
   
</eo:ComboBox>

When an EO.Web.ListBox is placed inside a ComboBox's DropDownTemplate, selecting an item in the list box automatically closes the drop down and fills the ComboBox's with the selected item's Text property. If the selected item's Icon is set, the value is also passed to the ComboBox, which displays the icon in the ComboBox's icon area if icon area is enabled.

You can use more than one EO.Web.ListBox controls in DropDownTemplate.

Using Other Controls In DropDownTemplate

Any ASP.NET server control or valid HTML markup can be placed inside DropDownTemplate. However only an EO.Web.ListBox will automatically fill the ComboBox when an item is clicked. For other controls/HTML markup, you must manually call eo_SetComboBoxValue to set the ComboBox value. The following code demonstrates how to fill the ComboBox with "item 1" when a link is clicked:

ASPX
<eo:ComboBox ....>
    ....
    <DropDownTemplate>
        <a href="eo_SetComboBoxValue(event, 'Item 1');">Hello!</a>
    </DropDownTemplate>
    ....
</eo:ComboBox>

DropDownTemplate background

When using custom DropDownTemplate, it is often necessary to give the drop down a solid background color and border. This can be done with a simple DIV element. For example:

ASPX
<eo:ComboBox ....>
    ....
    <DropDownTemplate>
        <div style="background-color:white; border: solid 1px #c0c0c0; padding: 2px;">
            <a href="eo_SetComboBoxValue(event, 'Item 1');">Hello!</a>
        </div>
    </DropDownTemplate>
   
</eo:ComboBox>

Note the additional DIV element and CSS background color, border and padding attributes.