使用本地存储缓存 Kendo 数据源数据

Question

我的页面有许多相同的 Kendo 下拉列表（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 以访问本地存储？

Answer 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>

简单！

使用本地存储缓存 Kendo 数据源数据

Using Local Storage to cache Kendo datasource data

ajax

asp.net-mvc

jquery

kendo-ui

kendo-asp.net-mvc