KendoUI 自动完成列表出现在文本框的顶部答案

【问题标题】：KendoUI Autocomplete list appears on top of the textboxKendoUI 自动完成列表出现在文本框的顶部
【发布时间】：2013-04-30 05:54:51
【问题描述】：

我正在使用 KendoUI for MVC 迈出第一步。我有一个非常简单的模型，它从数据库中读取表“产品”并将其作为强类型模型传递给视图。

我正在使用模型将其绑定到自动完成功能以获取建议值。这几乎可以正常工作。这是使用以下 Razor 语法完成的：

@(Html.Kendo().AutoComplete()
     .Name("productAutoComplete")
     .DataTextField("Name")
     .BindTo(Model)
     .Filter(FilterType.StartsWith)
     .Placeholder("Select the product")
     .Suggest(true)
)

我遇到的问题是包含自动完成建议的下拉列表出现在文本框本身的顶部（而不是在它的正下方）。

请查看下图，不要在自动完成字段中输入任何内容：

并使用自动完成功能：

你有什么建议吗？

提前致谢，

左撇子

【问题讨论】：

您是否在页面中包含了正确的 CSS 文件？没有这些，剑道将无法正确渲染。
我使用“Telerik Kendo UI for ASP.NET MVC VSExtensions”设置项目。我想它包含了正确的 CSS（据我所知）
我怀疑一些浮动 div 搞砸了，但很难说。 CSS 有点常见，但看起来你已经链接了文件。打开你的 Chrome 元素检查器，看看你是否能确定其中一个封闭元素是否破坏了它。

标签： asp.net-mvc autocomplete kendo-ui

【解决方案1】：

我已经通过使用最新的 jQuery 库 (1.9.1) 而不是 KendoUI (1.7.1) 附带的库克服了这个问题。

我仍然不确定为什么这不适用于 1.7.1（1.9.0+ 可以）。

无论如何，KendoUI 最新版本（2013 年第一季度）都附带 1.9.1 jQuery。不幸的是，这似乎不能作为 KendoUI Complete for ASP.NET MVC 的试用版

我希望此解决方案对其他人有所帮助。

左撇子

【讨论】：