This is a migrated thread and some comments may be shown as answers.

Unable to cache a kendo.data.DataSource in localStorage

0 Answers 130 Views
Data Source
This is a migrated thread and some comments may be shown as answers.
Sean
Top achievements
Rank 1
Sean asked on 19 Oct 2012, 06:45 PM
Hello,
I am using the Kendo UI ComboBox with an external, XML DataSource. Here's the DataSource code:

    try
        {
            var csDataSrc = new kendo.data.DataSource(
            {
                transport:
            {
                read: "Data/StateList.xml",
                dataType: "xml",
                create: { cache: true }
            },
            schema:
            {
                type: "xml",
                data: "/States/State",
                model:
                {
                    fields:
                    {
                        id: "id/text()",
                        name: "name/text()"
                    }
                }
            }
        });
        csDataSrc.read();
    }
    catch (err)
    {
        log.error(err.message);
    }


That creates the data source, here's the code that creates the kendo combobox:


    $("#stateList").kendoComboBox(
    {
   index: 0,
   placeholder: "Begin typing Coverage State...",
   dataTextField: "name",
   dataValueField: "id",
   filter: "contains",
   dataSource: csDataSrc,
   text: $("#hdnStateName").val(),
   value: $("#hdnStateKey").val(),
   change: function(e)
   {
   $("#hdnStateKey").val(this.value());
   $("#hdnStateName").val(this.text());
   }
    });


This works really well but the data for the real list is enormous and I'd like to store it in local storage with something like this:
    localStorage.setItem("state_key", csDataSrc);
Then when the page loads instead of building and reading from the server side xml all the time, I'd like for it to be something like this:


    var csDataSrc = localStorage.getItem("state_key");
    if(csDataSrc === null)
    {
        // create the data source with the above code
        // and store it in localStorage.
    }
Then bind it here...


    ...kendoComboBox(
    {
        ...,
        .dataSource: csDataSrc,
        ...
    });


I create the data source fine, it seems to store correctly in localStorage but when you leave the page and come back the data source is always null.  I can see it using the resources tab of the Chrome developer tools but it won't bind to the combo box correctly.
Any help or if I need to elaborate on anything to make this clearer please let me know


Thanks
-s

No answers yet. Maybe you can help?

Tags
Data Source
Asked by
Sean
Top achievements
Rank 1
Share this question
or