使用 Javascript/KendoUI 自动完成渲染数据时出错 - Object #<Object>没有方法“切片" - 如何解决? [英] Error rendering data with Javascript / KendoUI autocomplete - Object #<Object> has no method 'slice' - how to resolve?
本文介绍了使用 Javascript/KendoUI 自动完成渲染数据时出错 - Object #<Object>没有方法“切片" - 如何解决?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在关注 使用 Kendo UI 和 MVC4 WebAPIOData 和 EF 文章.安装 KendoUI 并确保设置了所有引用后，我输入了三个字符，并收到以下错误:
<块引用>Uncaught TypeError: Object # has no method 'slice'
问题的根源
为了节省阅读更新:通过调试，我发现问题是 JS 期望解析一个数组，而它在数据中不可用 - 在根.在数据层次结构中，它是一级.
原始问题
我清理了 kendo.web.min.js 并且错误发生在第 3498 行附近:
成功:函数(n){var i = 这个，r = i.options;返回 i.trigger(wt, {回复: n,类型:阅读"}), n = i.reader.parse(n), i._handleCustomErrors(n) ?(i._dequeueRequest(), t) : (i._pristine = et(n) ? e.extend(!0, {}, n) : n.slice ? n.slice(0) : n, i._total =i.reader.total(n), i._aggregate && r.serverAggregates && (i._aggregateResult = i.reader.aggregates(n)), n = i._readData(n), i._pristineData= n.slice(0), i._data = i._observe(n), i._addRange(i._data), i._process(i._data), i._dequeueRequest(), t)Kendo UI 小部件和 css 一样加载得很好:
<link href="~/Content/kendo/kendo.default.min.css" rel="stylesheet"/><script src="~/Scripts/jquery-1.9.1.min.js"></script><script src="~/Scripts/kendo/kendo.web.min.js"></script><script src="~/Scripts/kendo/kendo.aspnetmvc.min.js"></script><script src="~/Scripts/appScripts.js"></script>而且我在使用 Razor MVC 帮助程序/扩展时看到了同样的错误:
@(Html.Kendo().AutoComplete().Name("userAutoComplete")//指定小部件的id"属性.DataTextField("用户名").DataSource(源=>{source.Read(读=>{read.Url("/api/user");}).ServerFiltering(true);//如果为 true，DataSource 将不会过滤客户端上的数据}))直接通过JS:
///<参考路径="kendo/kendo.aspnetmvc.min.js"/>///<reference path="kendo/kendo.core.min.js"/>///<reference path="kendo/kendo.autocomplete.min.js"/>///<reference path="kendo/kendo.web.min.js"/>$(document).ready(function () {//加载 KendoUI//从/api/user 获取数据var dataSource = new kendo.data.DataSource({运输: {读: {网址:/api/用户"}}});$("#userSearch").kendoAutoComplete({数据源:数据源，数据文本字段:用户名"，最小长度:3});$("#userSearch").on('input', function () {console.log($("#userSearch").val());});});//$(document).ready()我确定这是我可能遗漏的一些简单的东西.我已经尝试过 web 和所有 js 文件.
如有任何帮助，我们将不胜感激.
-- 更新 --
该内容中唯一缺少的真正 html 是 <input id="userAutoComplete"/>
基于从 http 获取 JSON 数据的 Kendo UI 示例之一，我创建了一个全新的解决方案和一个非常简单的视图://api.geonames.org，并得到同样的错误.
我认为使用最新的 JS 库(//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js 可能会导致问题，所以我尝试了 1.7 lib.同样的问题:
@using Kendo.Mvc.UI@{布局 = 空；}<!DOCTYPE html><头><meta name="viewport" content="width=device-width"/><title>索引</title><link rel="stylesheet" href="@Url.Content("~/Content/kendo.common.min.css")"><link rel="stylesheet" href="@Url.Content("~/Content/kendo.default.min.css")"><link rel="stylesheet" href="@Url.Content("~/Content/kendo.dataviz.min.css")"><script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><script src="@Url.Content("~/Scripts/kendo.web.min.js")"></script><script src="@Url.Content("~/Scripts/kendo.aspnetmvc.min.js")"></script><script src="@Url.Content("~/Scripts/kendo.dataviz.min.js")"></script><script type="text/javascript">$(document).ready(function () {$("#autoComplete").kendoAutoComplete({最小长度:6，数据文本字段:标题"，过滤器:包含"，数据源:新 kendo.data.DataSource({运输: {读: {url: "http://api.geonames.org/wikipediaSearchJSON",数据: {q:函数(){返回 $("#autoComplete").data("kendoAutoComplete").value();},最大行数:10，用户名:演示"}}},架构:{数据:地名"}}),改变:函数(){this.dataSource.read();}})});<身体><div><input id="autoComplete"/>