时间戳

首页 > 解决方案 > 剑道自动完成截断选定的值

kendo-ui - 剑道自动完成截断选定的值

问题描述

剑道障碍

我正在尝试使用 Kendo 自动完成组件，但我不断收到这个灰色条，当它被选中时，它会掩盖部分答案。

有谁知道谁来解决这个问题？

请参阅下面的代码：

<link href="~/Scripts/Kendo/styles/kendo.common.min.css" rel="stylesheet" />
<link href="~/Scripts/Kendo/styles/kendo.bootstrap.min.css" rel="stylesheet" />

<script src="~/Scripts/Kendo/js/kendo.ui.core.min.js"></script>
<script src="~/Scripts/Kendo/js/kendo.combobox.min.js"></script>

<div class="k-content">
<input id="siteItem" placeholder="Select site..." style="width:100%"   />


$.getJSON("/FormReport/GetSites/" + org + "/" + e.dataItem.Value,
        function (data) {

            $("#siteItem").kendoComboBox({
                autoWidth: true,

                dataTextField: "Text",
                dataValueField: "Value",
                dataSource: data,
                filter: "contains",
                suggest: true 
            });
        });

标签： kendo-uikendo-autocomplete

解决方案

解决该问题的方法是 style="min-width=100%"。文本框在页面加载时开始，没有附加数据，因此实际上没有使用正确的宽度。稍后添加数据时，它不会补偿到正确的宽度。使用 min-width 可以在动态附加数据之前正确绘制文本框，因此会删除幻影灰色框（我相信它是 X 或清除按钮）。

推荐阅读