离线支持
在Kendo UI 2014 Q2 SP1发布时，用于jQuery DataSource组件的Kendo UI提供了离线支持，这使得数据绑定的Kendo UI可以用于jQuery小部件，无需活动服务器连接。
用户可以继续使用可用数据，直到网络连接恢复为止。当连接可用时，DataSource将所有更改与远程服务同步。
离线存储机制
启用离线存储
如果需要启用离线存储特性，请设置offlineStorage选择。数据源在保存和加载其状态时使用此值作为键。默认情况下，为了保持其脱机状态，数据源使用localStorage选择。
若要使用脱机存储，请为模型提供指定的
ID字段。
下面的示例演示如何设置脱机存储键。
var dataSource =新的kendo.data。DataSource({offlineStorage: "products-offline"，传输:{读取:{url: "https://demos.telerik.com/kendo-ui/service/products"， dataType: "jsonp"}}， schema: {model: {id: "ProductID"}}});切换离线模式和在线模式
默认情况下，数据源是在线的。属性配置的远程服务中包含所有数据项更改，例如创建、更新和销毁运输选择。
- 要返回联机模式，请调用
在线方法真正的作为一个论证。结果，DataSource调用同步方法将所有脱机更改发送到远程服务。 - 若要切换到脱机模式，请调用
在线方法假作为一个论证。因此，DataSource开始在脱机存储中持久化所有数据项更改。
下面的示例演示如何进入脱机模式。
var dataSource = kendo.data。数据源({offlineStorage: "products-offline"，传输:{读取:{url: "https://demos.telerik.com/kendo-ui/service/products"，类型:"jsonp"}，更新:{url: "https://demos.telerik.com/kendo-ui/service/products/update"， dataType: "jsonp"}， parameterMap:函数(选项，操作){if(操作!== "read" && options.models){返回{模型:kendo.stringify(选项.models)};模式}}}:{模型:{id:“ProductID}}});//从远程服务获取数据dataSource.fetch(function(){//进入离线模式。dataSource.online(假);//做一些改变。dataSource.at(0)。设置(“ProductName”、“更新”);//同步以接受更改(数据源将更改保存在localStorage中)。 dataSource.sync(); // Optionally go back online (the data source syncs the change with the remote service). dataSource.online(true); });获取当前离线状态
的offlineData方法返回DataSource的当前离线状态。状态是表示数据项的JavaScript对象数组。已更改的数据项具有附加的__state__字段，表示修改类型-“创造”，“更新”,或“破坏”．未修改的数据项没有__state__字段。
如果
servergroup中选项设置为真正的的offlineData按以下方式返回组的数组{值:“组值”，字段:“组字段”，项:[/*组中的数据项*/]}．
var dataSource = kendo.data。数据源({offlineStorage: "products-offline"，传输:{读取:{url: "https://demos.telerik.com/kendo-ui/service/products"，类型:"jsonp"}，更新:{url: "https://demos.telerik.com/kendo-ui/service/products/update"， dataType: "jsonp"}， parameterMap:函数(选项，操作){if(操作!== "read" && options.models){返回{模型:kendo.stringify(选项.models)};模式}}}:{模型:{id:“ProductID}}});dataSource.fetch(function(){//进入离线模式。dataSource.online(假);//修改第一个数据项的ProductName字段。dataSource.at(0)。设置(“ProductName”、“更新”);//同步以接受更改。dataSource.sync (); // Get the offline data. var offlineData = dataSource.offlineData(); console.log(offlineData[0].__state__); // Displays "update". });使用自定义离线存储
要使用自定义脱机存储，请设置offlineStorage属性的JavaScript对象getItem方法，该方法返回数据setItem方法，该方法保存数据。
var dataSource = kendo.data。DataSource({//使用sessionStorage代替localStorage。offlineStorage: {getItem: function(){返回JSON.parse(sessionStorage.getItem("products-key"));}， setItem:函数(项目){sessionStorage. xmlsetItem("products-key", JSON.stringify(item)); } }, transport: { read: { url: "https://demos.telerik.com/kendo-ui/service/products", type: "jsonp" } } });浏览器互联网连接
在撰写本文时，还没有跨浏览器的方法来确定web应用程序是否具有Internet访问。另外，浏览器处理在线模式的方式不同，这就是DataSource不尝试自动检测离线模式的原因。有关浏览器在线模式的更多信息，请参阅这篇MDN文章．
要将数据源配置为自动检测脱机模式，请使用句柄在线而且离线事件或使用AJAX轮询。
处理在线和离线事件
的在线而且离线不同浏览器的事件行为不同。当用户在离线和在线模式之间切换时，Firefox和Internet Explorer会触发这些事件。然而,在线而且离线事件在移动设备和PhoneGap应用程序中按预期工作。
var dataSource = kendo.data。DataSource({offlineStorage: "products-offline"，传输:{读取:{url: "https://demos.telerik.com/kendo-ui/service/products"，类型:"jsonp"}}});dataSource.online (navigator.onLine);美元(窗口)。on("offline"， function() {dataSource.online(false);});美元(窗口)。on("online"， function() {dataSource.online(true);})；使用AJAX轮询
AJAX轮询比使用在线而且离线事件，最适合桌面浏览器，但会导致持续的HTTP请求(CPU和带宽占用)。AJAX请求可能会失败，不仅是因为Internet连接中断，还因为服务器错误和超时。
var dataSource = kendo.data。DataSource({offlineStorage: "products-offline"，传输:{读取:{url: "https://demos.telerik.com/kendo-ui/service/products"，类型:"jsonp"}}});//每5秒向某个URL发送一个请求，以查看Internet访问是否可用。var pollId = setInterval(函数(){$。ajax({//使用同一个域的URL来坚持同源策略。url: "/"}) .done(function() {// ajax请求成功。你可能在线。dataSource.online(真正的);}) .fail(function() {// AJAX请求失败。你可能离线了。 dataSource.offline(false); }); }, 5000);)常见问题
这是在使用Kendo UI DataSource组件时与离线数据存储相关的最常见问题(FAQ)的集合。
可用的离线存储空间是多少?
默认的本地存储空间为每个源5MB左右，即特定的域、端口和协议。但是，它可以依赖于浏览器和由用户控制的浏览器设置。从理论上讲，可以通过尝试保存大块数据来测量最大可用存储空间localStorageAPI。这种方法可能会暂时中断浏览器的响应能力，因此不推荐使用。
Web应用程序是否可以请求浏览器分配更多的离线存储空间?
不。
几个DataSource实例共享同一个脱机存储空间吗?
是的。此外，不同的Kendo UI DataSource实例必须使用不同的offlineStorage钥匙。否则，它们将覆盖彼此保存的数据。
如何查看当前使用的本地存储空间?
根据存储数据的方式和所需的实现，可用的方法各不相同。要度量DataSource实例存储的数据量，请使用以下示例。
//查看指定密钥的离线存储空间使用量。JSON.stringify (localStorage.getItem(“your-offlineStorage-key-here”))。length //查看总体离线存储空间使用情况。JSON.stringify (localStorage) . length当超出离线存储配额时会发生什么?
数据保存失败，浏览器抛出异常。要处理错误，请使用定制的offlineStorage实现与试一试……抓块。