在 WebForms 下拉菜单中缩短选项

Question

我在 WebForms 中创建了 dropDownList 并将一些数据列表（'Title' 和 'Id'）绑定到它。

Ddltitlelist.DataSource = submissionTitleList;
Ddltitlelist.DataTextField = "Submission_Title";
Ddltitlelist.DataValueField = "Submission_Id";
Ddltitlelist.DataBind();

但是Title太长了就不好看了。我尝试手动将 max-width 设置为 select 选项，但这不起作用。

所以我的想法是将 max-width 设置为选项并在标题太长时添加“...”并为每个选项添加标题（当悬停在某个选项上时会显示类似标准工具提示的内容).但首先我需要限制 select 选项的宽度。

Answer 1

如果没有看到您的代码很难说，但是您可以做的一种方法是限制 SQL 中文本的长度。像这样

select Submission_Id,
Left(Submission_Title, 20) as Submission_Title
from Submission
where ....

另一种选择是在数据绑定后调整长度，trim那样

ASP.NET

<asp:DropDownList ID="Ddltitlelist" runat="server"
    OnDataBound="Ddltitlelist_DataBound">
</asp:DropDownList>

代码隐藏

protected void Ddltitlelist_DataBound(object sender, EventArgs e)
{
    foreach (ListItem li in Ddltitlelist.Items)
    {
        string text = li.Text;

        // set tooltip on drop down
        li.Attributes.Add("title", text);
        // if over 20 characters, trim to fit
        if (text.Length > 20)
        {
            // trim to 17 and add 3 periods for an ellipsis
            li.Text = text.Substring(0, 17) + "...";
        }
    }
}

在 WebForms 下拉菜单中缩短选项

Make shorter options in WebForms dropdown

html

css

asp.net

webforms

drop-down-menu