设置剑道ui下拉列表宽度

问题描述

我想使用kendo下拉列表，它有固定大小，因为受页面中其他字段的限制，但是当它显示列表的下拉项时，下拉区域应该调整大小到项目的最大长度.显示项目的固定宽度排序，但下拉列表的自动宽度.类似的东西

I would like to use a kendo drop-down list, which has a fixed size since is constrained by other fields in the page, but when it shows the drop-down items of the list, the drop-down area should resize to the maximum length of the items. Sort of fixed width for the item displayed, but auto width for the drop down list.Something like

|my choice |     <-- fixed width displayed on the page

|next choice     |
|previous choice |  <-- dropdown area to select another item
|dummy           |

这是否可以通过 CSS 或通过 jQuery 设置的下拉列表属性实现?

Is this possible through CSS or drop-down list properties set through jQuery?

推荐答案

您可以使用 CSS 或方法设置下拉列表的宽度.

You can set the width of a DropDown List both using a CSS or using a method.

如果你 DropDownList 的 id 是 my-dropdown 那么你应该写:

If the id of you DropDownList is my-dropdown then you should write:

• 使用 CSS

• Using CSS

#my-dropdown-list {
    width: auto !important;
}

注意:我们已将 -list 附加到原始 id.!important"很重要，因为您想覆盖原始宽度定义.

NOTE: We have appended -list to the original id. The "!important" is important since you want to overwrite original width definition.

• 使用方法

• Using a method

$("#my-dropdown").data("kendoDropDownList").list.width("auto");

除了使用"auto"让宽度自动适应文本外，还可以使用固定宽度:

In addition to use "auto" for getting the width automatically adjusted to the text, you can use a fixed width:

#my-dropdown-list {
    width: 300px !important;
}

或:

$("#my-dropdown").data("kendoDropDownList").list.width(300);

这篇关于设置剑道ui下拉列表宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！