Question

你可以告诉我如何为剑道下拉设置宽度吗？这是我的代码示例，它无法正常工作。有什么问题吗？

$("#div1").kendoDropDownList({
    dataSource: items,
    dataTextField: "Name",
    dataValueField: "Id",
    Width : "250px"
});

Answer 1

kendoDropDownList没有配置的属性宽度。见这里：Kendo Docs

你能做什么，是正确的班级造型。由于您希望知道下拉列表的位置，因此您可以指定选择器，使其不适用于所有下拉列表。

#myContainer .k-dropdown {
     width: 250px;
}

Answer 2

如果您必须为不同的控件指定不同的宽度，可以按照以下方法为特定控件提供宽度。

$("#div1").width(250).kendoDropDownList({
    dataSource: items,
    dataTextField: "Name",
    dataValueField: "Id",
})

Answer 3

如果应用MVC Razor DropDownList HTML帮助程序/包装器语法，则可以使用方法HtmlAttributes指定下拉列表的宽度，如：

 @(Html.Kendo().DropDownList()                                                            .Name("myDDL")
.HtmlAttributes(new { style="width:100px" })

Answer 4

你也可以试试这个;

<script type="text/javascript">
  $(document).ready(function() {
    var kendoDropDown = $('#div1').data('kendoDropDownList');
    kendoDropDown.list.width(250);
  });
</script>

可以在Telerik的官方API参考中找到here的进一步文档。

Answer 5

最好用CSS

来做

#div1 {     
    width: 250px;
}

但是可以使用代码

$("#div1").width(250).kendoDropDownList({
    dataSource: items,
    dataTextField: "Name",
   dataValueField: "Id",
})

Answer 6

保持浏览器设置的自动宽度：

$("select").each(function () {
    $(this)
        .width($(this).width())
        .kendoDropDownList();
});

Answer 7

这将100％工作，因为它对我有用，我尝试了上面的解决方案，它不适合我，所以我发现这个我自己:)，我希望你们都能从中受益

#DivThatContainsTheDropdown .k-combobox{
width: 22em !important;
}

剑道下拉宽度

7 个答案: