是否可以在活动中更改Kendo ComboBox选项的宽度？

Question

我的Kendo ComboBox的显示宽度有限，因此在正常状态下，我需要相当窄。选项项利用了“模板”，比ComboBox宽得多。我想在用户点击/使用ComboBox时更新宽度，并且当我正在进行的js / css更改似乎工作时，选项项目不会以正确的宽度显示，直到第二次单击组合框 - 实际的COMbox框宽度更改。

@Html.Kendo().ComboBox()
             .Name("Type")
             .BindTo(Model.Types)
             .Events(e => { e.Open("TypeOpen"); })
             .Template("<div style='width: 300px'>${ data.Text }</div>")

// js

function TypeOpen() {
  $("#Type").closest(".k-widget").css("width", "300px");
}

//首次点击后;第二次点击后它看起来不错

Answer 1

如果您将DropDownList放在div中，则可以使用css控制下拉列表大小：

    <div id="myCombo">
        @Html.Kendo().ComboBox().HtmlAttributes(new { style = "width:50px" }) 
                     .Name("Type")
                     .BindTo(Model.Types)
                     .Events(e => { e.Open("TypeOpen"); })
                     .Template("<div style='width: 300px'>${ data.Text }</div>")
    </div>

   <style>
     #myCombo-list
        {
            width: 100px !important;
        }    
   </style>