Chart DataSource 401 Unauthorized

2 posts, 0 answers
  1. Lyle 3M
    Lyle 3M avatar
    2 posts
    Member since:
    May 2012

    Posted 12 Dec 2012 Link to this post

    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);
          });
  2. Petur Subev
    Admin
    Petur Subev avatar
    1882 posts

    Posted 14 Dec 2012 Link to this post

    Hello Lyle,

    If the cookie is sent with regular $.ajax request then it should be also sent when the dataSource.read is being called.

    On a side note you can send additional parameters to the server with the help of the data function or by passing an object literal to the dataSource.read method.

    I could suggest you to search the internet for similar issues.

    Kind Regards,
    Petur Subev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top