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>
<link rel=
"stylesheet"
href=
"http://cdn.kendostatic.com/2015.1.408/styles/kendo.common.min.css"
>
<link rel=
"stylesheet"
href=
"http://cdn.kendostatic.com/2015.1.408/styles/kendo.rtl.min.css"
>
<link rel=
"stylesheet"
href=
"http://cdn.kendostatic.com/2015.1.408/styles/kendo.default.min.css"
>
<link rel=
"stylesheet"
href=
"http://cdn.kendostatic.com/2015.1.408/styles/kendo.dataviz.min.css"
>
<link rel=
"stylesheet"
href=
"http://cdn.kendostatic.com/2015.1.408/styles/kendo.dataviz.default.min.css"
>
<link rel=
"stylesheet"
href=
"http://cdn.kendostatic.com/2015.1.408/styles/kendo.mobile.all.min.css"
>
<script src=
"http://code.jquery.com/jquery-1.9.1.min.js"
></script>
<script src=
"http://cdn.kendostatic.com/2015.1.408/js/kendo.all.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: {
dataType:
"jsonp"
},
update: {
dataType:
"jsonp"
},
create: {
dataType:
"jsonp"
},
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