AjaxControlToolkit，组合框样式答案

【问题标题】：AjaxControlToolkit, ComboBox styleAjaxControlToolkit，组合框样式
【发布时间】：2010-12-14 01:55:21
【问题描述】：

ComboBox 控件 (AjaxControlToolkit) 的箭头图像有点问题。

我定义了这种风格：

.WindowsStyle .ajax__combobox_inputcontainer .ajax__combobox_buttoncontainer button
{
    margin: 0;
    padding: 0;
    background-image: url(../icons/windows-arrow.gif);
    background-position: top left;
    border: 0px none;
    height: 21px;
    width: 21px;
}

我在组合框上设置了这种样式，但是控件在箭头之前显示了文本框的边框：

看here，边框没有显示！

如何隐藏此边框？

【问题讨论】：

标签： asp.net css combobox ajaxcontroltoolkit

【解决方案1】：

这对我来说很好用，我的页面标题中有以下 css（当然它可以放在样式表中的任何其他地方）

<style type="text/css">
    .WindowsStyle .ajax__combobox_inputcontainer .ajax__combobox_textboxcontainer input
    {
        margin: 0;
        border: solid 1px #7F9DB9;
        border-right: 0px none;
        padding: 1px 0px 0px 5px;
        font-size: 13px;
        height: 18px;
        position: relative;       
    }
    .WindowsStyle .ajax__combobox_inputcontainer .ajax__combobox_buttoncontainer button
    {
        margin: 0;
        padding: 0;
        background-image: url(windows-arrow.gif);
        background-position: top left;
        border: 0px none;
        height: 21px;
        width: 21px;
    }
    .WindowsStyle .ajax__combobox_itemlist
    {
        border-color: #7F9DB9;
    }
</style>

然后我的页面正文中有这个控件标记：

<ajaxToolkit:ComboBox ID="ComboBox1" runat="server" CssClass="WindowsStyle">
<asp:ListItem Text="[Select an item]" Value="" />
<asp:ListItem Text="Actual Item #1" Value="SomeValue" />
<asp:ListItem Text="Actual Item #2" Value="3" />
<asp:ListItem Text="Actual Item #3" Value="xxx" />
</ajaxToolkit:ComboBox>

也许您有一些冲突的样式？您是否尝试过只需要生成组合框的简单页面？

【讨论】：

【解决方案2】：

我想为输入框应用一个命名的 CSS 类（即来自 Bootstrap 的表单控件），您可以在 PreRender 事件中设置 InputBox CssClass。

<ajaxToolkit:ComboBox ID="ddlTracker" runat="server" OnPreRender="ddlTracker_PreRender"/>


protected void ddlTracker_PreRender(object sender, EventArgs e)
{
    AjaxControlToolkit.ComboBox c = (AjaxControlToolkit.ComboBox)sender;
    TextBox t = (TextBox)c.FindControl("ddlTracker_TextBox");
    t.CssClass = "form-control";
}

【讨论】：