Issue / Bug(?) when starting the DataSource in offline mode

6 posts, 0 answers
  1. Christian
    Christian avatar
    4 posts
    Member since:
    May 2011

    Posted 18 May 2015 Link to this post

    Hello,

    I'm working with the SchedulerDataSource within an Android Cordova project and I'm using the offline capabilities of the SchedulerDataSource keep the data in the LocalStorage when the device goes offline. As long as the App is running going on- and offline works as expected, but when I start the App offline (i.e. without network connection) the data within the LocalStorage gets corrupted and is pretty useless afterwards. As far as I could find out the issue is connected to the schema configuration of the datasource. When I use field mappings (the from option) in the model of the schema configuration all mapped field values are set to null upon an 'offline' startup.

    The problem is not related to Android as I can also reproduce it in a Windows environment. In addition the standard DataSource component shows the same behaviour.

    Here's a modified sample from the demos to illustrate the effect (see comment in code to simulate offline startup):

     

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title>Kendo UI Snippet</title>
     
     
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    </head>
    <body>
       
        <div id="example">
            <div id="team-schedule">
                <label>Online: </label><input id="online" type="checkbox" checked>
            </div>
            <div id="scheduler"></div>
        </div>
        <script>
          $(function() {
          var ds = new kendo.data.SchedulerDataSource({
                offlineStorage: "hs-scheduler-offlinetest",
                batch: true,
                transport: {
                  read: {
                    url: "http://demos.telerik.com/kendo-ui/service/tasks",
                    dataType: "jsonp"
                  },
                  update: {
                    url: "http://demos.telerik.com/kendo-ui/service/tasks/update",
                    dataType: "jsonp"
                  },
                  create: {
                    url: "http://demos.telerik.com/kendo-ui/service/tasks/create",
                    dataType: "jsonp"
                  },
                  destroy: {
                    url: "http://demos.telerik.com/kendo-ui/service/tasks/destroy",
                    dataType: "jsonp"
                  },
                  parameterMap: function(options, operation) {
                    if (operation !== "read" && options.models) {
                      return {models: kendo.stringify(options.models)};
                    }
                  }
                },
                schema: {
                  model: {
                    id: "taskId",
                    fields: {
                      taskId: { from: "TaskID", type: "number" },
                      title: { from: "Title", defaultValue: "No title", validation: { required: true } },
                      start: { type: "date", from: "Start" },
                      end: { type: "date", from: "End" },
                      startTimezone: { from: "StartTimezone" },
                      endTimezone: { from: "EndTimezone" },
                      description: { from: "Description" },
                      recurrenceId: { from: "RecurrenceID" },
                      recurrenceRule: { from: "RecurrenceRule" },
                      recurrenceException: { from: "RecurrenceException" },
                      ownerId: { from: "OwnerID", defaultValue: 1 },
                      isAllDay: { type: "boolean", from: "IsAllDay" }
                    }
                  }
                },
                filter: {
                  logic: "or",
                  filters: [
                    { field: "ownerId", operator: "eq", value: 1 },
                    { field: "ownerId", operator: "eq", value: 2 }
                  ]
                }
              });
            // --------------------------------------------------------------------------
            // --- uncomment line below to simulate an offline start upon page reload ---
            //ds.online(false);
             
            $("#scheduler").kendoScheduler({
              date: new Date("2013/6/13"),
              startTime: new Date("2013/6/13 07:00 AM"),
              height: 600,
              views: [
                "day",
                { type: "workWeek", selected: true },
                "week",
                "month",
                "agenda"
              ],
              timezone: "Etc/UTC",
              dataSource: ds,
              resources: [
                {
                  field: "ownerId",
                  title: "Owner",
                  dataSource: [
                    { text: "Alex", value: 1, color: "#f8a398" },
                    { text: "Bob", value: 2, color: "#51a0ed" },
                    { text: "Charlie", value: 3, color: "#56ca85" }
                  ]
                }
              ]
            });
     
            $("#online").on("change", function() {
                alert("Online: " + this.checked);
                $("#scheduler").data("kendoScheduler").dataSource.online(this.checked);
            });
          });
        </script>
    </body>
    </html>

     

    Any help or hint how to get around this is highly appreciated.

    Thank's in advance.

     

    Kind regards,

    Chris

     

  2. Rosen
    Admin
    Rosen avatar
    3237 posts

    Posted 21 May 2015 Link to this post

    Hello Christian,

    Thanks for the report and the sample. We were able to observe the issue locally and to address it. The fix will be available in the next internal build. Meanwhile, as a temporary workaround, you could use a custom offline storage, where to call DataSource reader serialize method when saving the data, similar to the following:

    var key = "hs-scheduler-offlinetest";
    var ds = new kendo.data.SchedulerDataSource({
      offlineStorage:  {
        getItem: function() {
          return JSON.parse(localStorage.getItem(key));
        },
        setItem: function(item) {             
          localStorage.setItem(key, kendo.stringify(ds.reader.serialize(item)));
        }
      },
      /*..*/
    });

    Regards,
    Rosen
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Patrick
    Patrick avatar
    29 posts
    Member since:
    Apr 2014

    Posted 15 Aug 2015 in reply to Rosen Link to this post

    I am having similar issues.  Was this ever resolved?  It appears that when working offline on an empty datasource the first records is corrupt with null values.
  5. Rosen
    Admin
    Rosen avatar
    3237 posts

    Posted 17 Aug 2015 Link to this post

    Hello Patrick,

    Indeed, the issue discussed here has been already resolved. You can check this by yourself with an updated version of the initial test case.

    Regards,
    Rosen
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  6. Patrick
    Patrick avatar
    29 posts
    Member since:
    Apr 2014

    Posted 18 Aug 2015 in reply to Rosen Link to this post

    I am still having the issue but I am not using a scheduler data source.  I am able to clean up the data by using a custom offline object which lets me create/read/update/delete offline but when I go online to sync it does not work.  I don't have visibility into the sync code to determine why it is not working.  I post more details on my question in a separate forum thread but i have not had any responses.  I may try to set up a dojo using teleriks dbs to reproduce.
  7. Rosen
    Admin
    Rosen avatar
    3237 posts

    Posted 20 Aug 2015 Link to this post

    Hello Patrick,

    My colleague already provide you with an answer in the forum post you have opened. If you have additional comments please continue the discussion there.

    Regards,
    Rosen
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready