使用 Local Storage 缓存 Kendo 数据源数据答案

【问题标题】：Using Local Storage to cache Kendo datasource data使用 Local Storage 缓存 Kendo 数据源数据
【发布时间】：2015-03-11 04:07:20
【问题描述】：

我有一个页面，其中包含许多相同的 Kendo DropDownLists（MVC 风格）。我想在页面加载时缓存将用于在 ajax 中填充下拉列表的数据集，然后根据需要将下拉列表绑定到此本地数据对象。

目前我正在执行以下操作以在页面加载时创建一个 LocalStorage 对象：

 $.ajax({
        url: "/Job/GetEmployees",
        type: "get",
        datatype: 'json',
        success: function (data) {
            var dataSource = new kendo.data.DataSource({
                offlineStorage: "employeesStorage",
                data: data
                });
            dataSource.read();
            return false;
        },
        error: function (msg) {
          //  tostr.error("Error: " + msg.statusText);
        }
    });

这成功创建了一个名为 employeesStorage 的本地存储对象，其中包含正确的数据。

尽管进行了很多谷歌搜索，但我看不到如何利用这些数据来填充我的 EditorTemplates - 我得到的最接近的是：

@Modeltype models.employeesVM
@(Html.Kendo().DropDownList _
    .Name("Salesman") _
        .DataValueField("employee_id") _
        .DataTextField("LastName") _
        .DataSource(Function(s) s.Read(Function(read) read.Action("GetEmployees", "Job"))) _
        .OptionLabel("Select Employee")
)

...这显然是从控制器中填充 DDL，而实际上我想从本地数据中填充它。如何重新配置 DDL 以访问本地存储？

【问题讨论】：

标签： jquery ajax asp.net-mvc kendo-ui kendo-asp.net-mvc

【解决方案1】：

好的 - 来自 Telerik 支持的一些帮助，我得到了答案。

DropDownList 不支持从本地存储中填充自身，因此只需编写必要的 JS 在渲染时填充它：

   @Modeltype models.employeesVM
   @(Html.Kendo().DropDownList _
    .Name("Salesman") _
        .DataValueField("employee_id") _
        .DataTextField("Employee") _
    .OptionLabel("Select Employee"))

<script>
    var locate = JSON.parse(localStorage.getItem("employeesStorage"));
    $("#Salesman").data("kendoDropDownList").setDataSource(locate);
</script>

简单！

【讨论】：