I have a page with a chart on it that works great on most browsers I've tried. However, when I run this page on an iPad, then the fetch data fails with an Unauthorized exception. I've logged on and the authorization cookie should be send to my MVC WebAPI page which is secured to authorized users only. Is there some way to ensure that the proper cookies are sent with each request?
Thanks!
Lyle
function createChart() {
chartDataSource = new kendo.data.DataSource({
transport: {
read: {
url: function () {
return "/api/TEDMinute/" + CurrentDeviceId + "?QueryType=" + CurrentQueryType + "&EndDate=" + CurrentDate + '&Key2=' + CurrentDeviceId2;
},
dataType: "json"
}
},
requestStart: function(e) {
document.getElementById('errorMsg').innerHTML = '';
},
error: function(e) {
var currentTimeString = GetTimeString();
document.getElementById('errorMsg').innerHTML = 'Error fetching data at ' + currentTimeString + '! ' + e.status + ': ' + e.errorThrown;
},
sort: {
field: "ReadingDate",
dir: "asc"
},
change: function () {
$("#chart").data("kendoChart").refresh();
}
});
$("#chart").kendoChart({
theme: $(document).data("kendoSkin") || "default",
dataSource: chartDataSource,
title: { text: "Usage In Days" },
legend: { position: "top" },
seriesDefaults: {
type: "line"
},
series:
[
{ type: "line", field: "kWh", name: CurrentDeviceName, axis: "WattAxis", color: "#FF9900" },
{ type: "line", field: "kWh2", name: CurrentDeviceName2, axis: "WattAxis", color: "#339900" },
],
categoryAxis: {
field: "DisplayDate",
labels: { rotation: -90 }
},
valueAxis: [
{
name: "WattAxis",
title: { text: "kWh" },
min: 0,
majorUnit: 10,
color: "#FF9900"
}],
tooltip: {
visible: true,
format: "{0:N0}"
},
legend: {
position: "bottom"
}
});
}
$(document).ready(function () {
setTimeout(function () {
createChart();
$("#example").bind("kendo:skinChange", function (e) {
createChart();
});
$("#chart").data("kendoChart").options.title.text = "Energy Usage In Minutes for " + CurrentDeviceName;
}, 400);
});
Thanks!
Lyle
function createChart() {
chartDataSource = new kendo.data.DataSource({
transport: {
read: {
url: function () {
return "/api/TEDMinute/" + CurrentDeviceId + "?QueryType=" + CurrentQueryType + "&EndDate=" + CurrentDate + '&Key2=' + CurrentDeviceId2;
},
dataType: "json"
}
},
requestStart: function(e) {
document.getElementById('errorMsg').innerHTML = '';
},
error: function(e) {
var currentTimeString = GetTimeString();
document.getElementById('errorMsg').innerHTML = 'Error fetching data at ' + currentTimeString + '! ' + e.status + ': ' + e.errorThrown;
},
sort: {
field: "ReadingDate",
dir: "asc"
},
change: function () {
$("#chart").data("kendoChart").refresh();
}
});
$("#chart").kendoChart({
theme: $(document).data("kendoSkin") || "default",
dataSource: chartDataSource,
title: { text: "Usage In Days" },
legend: { position: "top" },
seriesDefaults: {
type: "line"
},
series:
[
{ type: "line", field: "kWh", name: CurrentDeviceName, axis: "WattAxis", color: "#FF9900" },
{ type: "line", field: "kWh2", name: CurrentDeviceName2, axis: "WattAxis", color: "#339900" },
],
categoryAxis: {
field: "DisplayDate",
labels: { rotation: -90 }
},
valueAxis: [
{
name: "WattAxis",
title: { text: "kWh" },
min: 0,
majorUnit: 10,
color: "#FF9900"
}],
tooltip: {
visible: true,
format: "{0:N0}"
},
legend: {
position: "bottom"
}
});
}
$(document).ready(function () {
setTimeout(function () {
createChart();
$("#example").bind("kendo:skinChange", function (e) {
createChart();
});
$("#chart").data("kendoChart").options.title.text = "Energy Usage In Minutes for " + CurrentDeviceName;
}, 400);
});