相信大家學(xué)習(xí)了RadControl中的RadWindow、RadAjaxManager、RadAjaxLoadingPanel控件后，一定會(huì)覺(jué)得它是解放.Net技術(shù)人員Web開(kāi)發(fā)的技術(shù)工具，從而不再為Asp.NET中的局部刷新而絞盡腦汁。

　　現(xiàn)在我告訴你，前邊才僅僅是你發(fā)現(xiàn)Web開(kāi)發(fā)更加容易、方便的第一步，通過(guò)下來(lái)項(xiàng)目中其他常用Rad控件的介紹，你會(huì)更加欣喜若狂。好了下來(lái)我就介紹另一重量級(jí)的控件Telerik.RadCombobox下拉列表控件。

　　RadCombobox控件是一個(gè)用于在ASP.NET應(yīng)用程序中的并能創(chuàng)建靈活下拉界面的控件。本產(chǎn)品具有的一系列豐富的特性，例如：異步回叫（asynchronous callbacks），自動(dòng)補(bǔ)全（Auto-Complete），自動(dòng)排序，驗(yàn)證，層疊顯示，自定義外觀等等。

　　其優(yōu)勢(shì)特征有：

　　1、強(qiáng)大的自動(dòng)補(bǔ)全（Auto-Complete）功能；

　　2、按需加載；

　　3、支持模板功能；

　　4、靈活的綁定機(jī)制；

　　5、豐富的服務(wù)器端及客戶(hù)端事件；

　　6、多組合框關(guān)聯(lián)使用

 您可以在同一頁(yè)面中設(shè)置多個(gè)r.a.d.combobox控件實(shí)例， 并且非常輕松的通過(guò)客戶(hù)端或者服務(wù)器端事件將它們關(guān)聯(lián)起來(lái)使用。

　　實(shí)例分析：

　　1、運(yùn)行圖

　　2、控件Html代碼：

　　 ;<telerik:RadComboBox ID="RadComboRole" runat="

server" HighlightTemplatedItems="true" AutoPostBack="true"
              &nbsp;     AllowCustomText="true"

OnClientDropDownClosed="onDropDownClosing"
  Width= "96%" onselectedindexchanged=

"RadComboRole_SelectedIndexChanged">
     <ItemTemplate>
  <div onclick="StopPropagation(event)" class="combo-item-template">
<asp:CheckBox runat="server" ID="chk1" onclick="onCheckBoxClick(this)" />
   <asp:Label runat="server" ID="Label1" AssociatedControlID="chk1">
                                    <%# Eval("RoleName") %>
                            </asp:Label>
                        </div>
                    </ItemTemplate>
        &nbsp;       </telerik:RadComboBox>

　　3、輔助的js腳本：　　　　

<script type="text/javascript" language="javascript">
        var cancelDropDownClosing = false;
        function onDropDownClosing() {
            cancelDropDownClosing = false;
        }

        function StopPropagation(e) {
            e.cancelBubble = true;
            if (e.stopPropagation) {
                e.stopPropagation();
            }
        }
        function onCheckBoxClick(chk) {
            var combo = $find( "<%= RadComboRole.ClientID %>");
            cancelDropDownClosing = true;
            var text = "";
            var values = "";
            var items = combo.get_items();
            for (var i = 0; i < items.get_count(); i++) {
                var item = items.getItem(i);
                var chk1 = $get(combo.get_id() + "_i" + i + "_chk1");
                if (chk1.checked) {
                    text += item.get_text() + ",";
                    values += item.get_value() + ",";
                }
            }
            text = removeLastComma(text);
        &nbsp;   values = removeLastComma(values);

            combo.set_text(text);
            combo.set_value(values);
        }
        function removeLastComma(str) {
            return str.replace(/,$/, "");
        }

4、后臺(tái)代碼：

        private void BindComBoxList()
        {
            List <SysRole> sysRoleList = SysRoleLogic.GetSysRoleList();
            RadComboRole.DataSource = sysRoleList;
            RadComboRole.DataTextField = "RoleName";
            RadComboRole.DataValueField = "RoleID";
            RadComboRole.DataBind();
        }

　通過(guò)以上四步便設(shè)置了以往需要做好多事情才可以做到的效果，另外此控件可以實(shí)現(xiàn)樹(shù)形選擇如下圖：

其Html代碼如下：

    <telerik:RadComboBox ID="RadComboBox2" Width=&quot;240px"

Height="300px" AllowCustomText="true"
        EmptyMessage="Showing all cars" OnClientDropDownClosing="OnClientDropDownClosingHandler"
        runat= "server">
        <ItemTemplate>
            <div onclick="StopPropagation(event)">
                <telerik:RadTreeView ID=&quot;RadTreeView1" runat=

"server" DataSourceID="SqlDataSource2"
        ;           ; DataTextField= "VehicleName" DataValueField=

"VehicleTypeID" DataFieldID="ID" DataFieldParentID="VehicleParentID"
                    OnClientNodeClicking= "OnClientNodeClickingHandler">
                    <DataBindings>
                  &nbsp;     <telerik:RadTreeNodeBinding Depth="0"

Category="Make" ImageUrlField="ImagePath" />
                    </DataBindings>
                </telerik:RadTreeView>
            </div>
        </ItemTemplate>
        <Items>
            <telerik:RadComboBoxItem />
        </Items>
     <;/telerik:RadComboBox>