Javascript 如何在剑道UI中设置组合框的自动宽度？

我想根据绑定到组合框的最长文本自动设置组合框的宽度，因此我尝试如下，但我只能看到组合框下拉（单击组合框时下拉）的自动大小（宽度），但长度仍大于预期，总长度应该减少到只能容纳3个字符，我是不是遗漏了什么

<input id="combobox" />

$("#combobox").kendoComboBox({
  index: 0,
  dataSource: {
    data: ["One", "Two"]
  }
});
var comboBox = $("#combobox").data("kendoComboBox");
comboBox.list.width("auto");
$("#combobox").width(parseInt($("#combobox").css("width")));

$（“#组合框”）.kendoComboBox({
索引：0，
数据源：{
数据：[“一”、“二”]
}
});
var组合框=$（“#组合框”）.data（“kendoComboBox”）；
comboBox.list.width（“自动”）；
$（“#组合框”）.width（parseInt（$（“#组合框”）.css（“width”））；

尝试添加此css

.k-combobox
{
    display: inline !important;
}

并注册公开赛

open: function(e) {
    var width = $(".k-combobox").width();
    $(".k-animation-container").width(width);
    $(".k-list-container").width(width - 4);
}

更新 也许您需要包装组合框并用

div

包装它

<div id="combobox-container">
   <input id="combobox" />
</div>

尝试添加此css

.k-combobox
{
    display: inline !important;
}

并注册公开赛

open: function(e) {
    var width = $(".k-combobox").width();
    $(".k-animation-container").width(width);
    $(".k-list-container").width(width - 4);
}

更新 也许您需要包装组合框并用

div

包装它

<div id="combobox-container">
   <input id="combobox" />
</div>

---

我想您可以确定数据源本身的长度，然后调整组合框的大小。这适用于演示项目，但我想这取决于样式和填充，您可能需要对大小调整技术进行更多改进

这决定了元素的大小（同样，如果在数组中使用的是对象而不是字符串，则可能需要对其进行一些细化（如果愿意，可以传递displayMember）

---

您可以在这里找到fiddle:

我想您可以确定数据源本身的长度，然后调整组合框的大小。这对于演示项目是有效的，但我想这取决于样式和填充，您可能需要对大小调整技术进行更多的改进

这决定了元素的大小（同样，如果在数组中使用的是对象而不是字符串，则可能需要对其进行一些细化（如果愿意，可以传递displayMember）

---

fiddle您可以在这里找到：

我想添加，如果您想拥有固定宽度的comboBox，而不考虑数据项的长度，那么在定义comboBox时定义“HtmlAttributes”属性：

 @(Html.Kendo().ComboBox().Name("myCombo")
   .DataTextField("Text")
   .DataValueField("Value")
   .Placeholder("--- Select ---")
   .DataSource(src => src.Read(read => read.Action("ActionMethod", "Controller")))
   .HtmlAttributes(new { style = "width: 200px;"})
   )

或来自javascript：

var combobox = $("#combobox").data("kendoComboBox");
combobox.list.width(200);

---

我想补充一点，如果您想拥有固定宽度的组合框，而不考虑数据项的长度，那么在定义组合框时定义“HtmlAttributes”属性：

 @(Html.Kendo().ComboBox().Name("myCombo")
   .DataTextField("Text")
   .DataValueField("Value")
   .Placeholder("--- Select ---")
   .DataSource(src => src.Read(read => read.Action("ActionMethod", "Controller")))
   .HtmlAttributes(new { style = "width: 200px;"})
   )

或来自javascript：

var combobox = $("#combobox").data("kendoComboBox");
combobox.list.width(200);

---

嗨，尤利安·钱德拉，我用截图更新了我的问题，我想像图中提到的那样自动调整组合框的大小。谢谢你的帮助。嗨，尤利安·钱德拉，我用截图更新了我的问题，我想像图中提到的那样自动调整组合框的大小。谢谢你的帮助。请启用fiddl我又需要它，我是怎么弄丢的。请你把小提琴打开好吗？我又需要它，我是怎么弄丢的。可能的重复