8 
 var ddlViews = $('#ddlViews').data("kendoDropDownList");
        ddlViews.list.width("auto");

我已将宽度添加为自动但它不起作用，下拉框的宽度也获得所选项目的最大宽度并溢出框外。我希望下拉框具有固定宽度，但下拉列表项应以单行显示内容。因为正常的下拉菜单会起作用。

4

6 回答 6

16 
.k-list-container{
    min-width:126px !important;//give a min width of your choice
    width: auto!important;
}
.k-list
{
    width:auto !important;
}

落下

链接到 js 小提琴

于 2013-07-18T03:45:03.437 回答
5

我们可以通过 2 种方式为 Kendo UI 组合框列表宽度设置宽度。

答案 1 *对于静态方式*

// get reference to the DropDownList
var dropdownlist = $("#size").data("kendoDropDownList");
// set width of the DropDownList
dropdownlist.list.width(500);

答案 -2使用 css的动态方式

    .k-list-container
    {
        white-space: nowrap !important;
        width: auto!important;
        overflow-x: hidden !important;
        min-width:243px !important;
    }

    .k-list
    {
        overflow-x: hidden !important;
        /*overflow-style: marquee;*/
        overflow-y: auto !important;
         width:auto !important;
    }

上面的 CSS 代码适用于动态数据加载。

于 2013-11-19T12:09:20.933 回答
3 
.k-dropdown {
    max-width:10em !important;
}

将这些添加到您的 CSS 中并且它可以工作，宽度将是您要指定的最大宽度，以便下拉框具有此最大宽度，而内容/项目将在一行中。

!important 属性强制添加您想要的样式。它也覆盖了剑道计算的宽度。

谢谢回答。

希望这可以帮助 ！拉扎

于 2013-07-19T06:53:09.150 回答
1

按照这个答案在你的下拉列表上设置宽度：剑道下拉宽度

.k-dropdown {
     width: 250px;
}
于 2013-07-17T13:24:13.293 回答
1

kendo现在完全支持它，带有autoWidth选项

<input id="dropdownlist" style="width: 100px;" />
<script>
$("#dropdownlist").kendoDropDownList({
  autoWidth: true,
  dataSource: {
    data: ["Short item", "An item with really, really long text"]
  }
});
</script>
于 2017-08-04T08:46:45.040 回答
0

要设置下拉框固定宽度（仅适用于列表），请使用

 ddlViews.list.width(200);

无论列表是否处于活动状态，要为下拉列表设置固定宽度，请将 CSS 中的宽度定义为

<select id="ddlViews"  style="width:200px;" >
    <option></option>
</select>

我能够通过css在一行中显示选项内容

ddlViews.list.css("white-space","nowrap");
于 2013-07-18T03:40:43.587 回答