劍道計劃不會採取數據源

我有一個JSON數組，它看起來是這樣的：劍道計劃不會採取數據源

var mockArr = [ 
{activity: "That One Activity", due_date: "07/22/2016", address: "22 Jump Ln", id: "42"}, 
{activity: "That Other Activity", due_date: "07/25/2015", address: "123 Fake St", id: "43"} 
];

，我試圖將其綁定到一個劍道調度部件，其配置是這樣的：

$("#scheduler").kendoScheduler({ 
      date: new Date(), 
      height: 100, 
      views: [ 
       {type: "day"}, 
       {type: "month", selected: true}, 
       {type: "agenda", selectedDateFormat: "{0:ddd, M/dd/yyyy} - {1:ddd, M/dd/yyyy}"} 
      ], 
      mobile: "phone", 
      timezone: "Etc/UTC", 
      allDaySlot:true, 
      editable: false, 
      dataSource: { 
       data: mockArr, 
       schema: { 
        model: { 
         id: "taskId", 
         fields: { 
          taskId: { from: "id", type: "number" }, 
          title: { from: "activity" }, 
          start: { type: "date", from: "due_date" }, 
          end: {type: "date", from: "due_date"}, 
          description: { from: "address" } 
         } 
        } 
       } 
      } 
    });

當我運行Web小型應用程序控制臺吐出「類型錯誤：e是空」，我也得到a page that looks like this

但我得到一個工作調度，當我更換mockArr和使用一個靜態的SchedulerEvent引用模型，如：

var event = new kendo.data.SchedulerEvent({ 
    id: 1, 
    title: "test event", 
    start: new Date("2016/7/22"), 
    end: new Date("2016/7/22") 
});

爲什麼調度器不像我的dataSource？

來源

2016-07-22 Wyatt G. M.

您遇到此問題的原因很少。

爲什麼頁面看起來就像圖像中的你提供的是因爲你指定的高度的原因：100卸下襬臂此行劍道框架自動處理它，你可以指定它以後根據您的需要。
你的Json數組需要格式化正確。看到代碼片斷提供
在數據源中的數據參數指望你需要使用這個數據來分析它的JavaScript對象：JSON.parse（mockArr），
我注意到，劍道不允許綁定啓動/結束參數在相同的名稱像你使用due_date所以它需要改變爲
start：{type：「date」，from：「due_date」}， end：{type：「date」，from ：「due_date1」}，

除了這個你的代碼工作正常我已經測試過它。

控制檯錯誤「Web小型應用程序控制臺吐出‘類型錯誤：e是空’的聲音是特定於Java，我假設你正在使用Java，並且可能與Java框架

下面是。您的真人版工作代碼的。

導航到Kendo UI online Editor並刪除預填充代碼並將其粘貼下面的代碼片段提供。

<!DOCTYPE html> 
<html> 
<head> 
    <base href="http://demos.telerik.com/kendo-ui/scheduler/index"> 
    <style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style> 
    <title></title> 
    <link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.714/styles/kendo.common-material.min.css" /> 
    <link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.714/styles/kendo.material.min.css" /> 
    <link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.2.714/styles/kendo.default.mobile.min.css" /> 

    <script src="//kendo.cdn.telerik.com/2016.2.714/js/jquery.min.js"></script> 
    <script src="//kendo.cdn.telerik.com/2016.2.714/js/kendo.all.min.js"></script> 
    <script src="//kendo.cdn.telerik.com/2016.2.714/js/kendo.timezones.min.js"></script> 
</head> 
<body> 
<div id="example"> 
    <div id="scheduler"></div> 
</div> 

<script> 

    var mockArr ='[{"activity":"That One Activity","due_date":"07/22/2016","due_date1":"07/22/2016","address":"22 Jump Ln","id":"42"},{"activity": "That Other Activity", "due_date": "07/25/2016","due_date1":"07/25/2016","address": "123 Fake St", "id": "43"}]'; 




$("#scheduler").kendoScheduler({ 
      date: new Date(),   
      views: [ 
       {type: "day"}, 
       {type: "month", selected: true}, 
       {type: "agenda", selectedDateFormat: "{0:ddd, M/dd/yyyy} - {1:ddd, M/dd/yyyy}"} 
      ],   

      allDaySlot:true, 
      editable: true, 
      dataSource: { 
       data:JSON.parse(mockArr), 
       schema: { 
        model: { 
         id: "taskId", 
         fields: { 
          taskId: { from: "id", type: "number" }, 
          title: { from: "activity" }, 
          start: { type: "date", from: "due_date" }, 
          end: { type: "date", from: "due_date1" }, 
          description: { from: "address" } 
         } 
        } 
       } 
      } 
    }); 



</script> 


</body> 
</html>

來源

2016-07-23 01:22:42

劍道計劃不會採取數據源

回答

相關問題