1

我的代码是

<asp:DropDownList ID="ddlFrom" runat="server" CssClass="From"></asp:DropDownList>

我的CSS代码是.From{ width:250px;height:25px}

高度不能这么大，因为里面有大量的物品。如何在下拉列表中添加垂直滚动条？

4

3 回答 3

1

网络上有一些第 3 方控件，您可以轻松地绑定它们。我只是提出了一个非常简单的解决方法，它涉及 DropDownExtender（AJAX ControlToolkit 的）、TextBox、ListBox 和几行 Javascript。

这里 TextBox 将保存列表框的选定值。我的 ASPX 代码如下：

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <asp:TextBox ID="TextBox1" runat="server" Text="Select your item" CssClass="MyTextBox"></asp:TextBox>
            <div style="padding: 4px;" id="ItemsDiv" runat="server">
                <asp:ListBox ID="ListBox1" runat="server" onclick="callme()" CssClass="MyDropDown" Rows="6">
                </asp:ListBox>
            </div>
            <asp:DropDownExtender ID="DropDownExtender1" runat="server" TargetControlID="TextBox1"
                DropDownControlID="ItemsDiv">
            </asp:DropDownExtender>
        </ContentTemplate>
    </asp:UpdatePanel>
<script>
   function callme() { 
           element = document.getElementById("ListBox1"); 
            str = element.options[element.selectedIndex].value; 
            document.getElementById("TextBox1").value = str; 
        } 
</script>
于 2013-05-13T07:11:54.910 回答
1

选项 1. 删除下拉菜单的高度，使其自动增长

选项 2。如果它在表格单元格或不允许它增长的东西中，则将其放入 div 中，如下所示

<div style="overflow-y:scroll; height:50px;
overflow: -moz-scrollbars-horizontal;">
<select....></select>
</div>

这里有一些例子点击这里

于 2013-05-13T08:33:02.473 回答
0

In the css class add overflow-y:auto, when the options length increases beyon 25px, you will get a scrollbar in y-axis of your dropdpwn

于 2013-05-13T07:05:47.133 回答