2016-11-14 34 views
0

我想知道如何將我在sql表上的信息獲取到Kendo調度器中。我目前在服務器上有Start,End,StartTimeZone,EndTimeZone,Description,Title等等。你需要Kendo Scheduler的所有東西,但是我有很多事件需要製作並放入日曆格式調度程序似乎是最好的方式來做到這一點。現在我的日曆視圖看起來像這樣從sql server獲取數據以顯示在Kendo Scheduler

@(Html.Kendo().Scheduler<**censored**.Models.LeaveRequest>() 

.Name("scheduler") 
.Date(new DateTime(2013, 6, 13)) 
.StartTime(new DateTime(2013, 6, 13, 7, 00, 00)) 
.Height(600) 
.Views(views => 
{ 
    views.DayView(); 
    views.WeekView(); 
    views.MonthView(MonthView => MonthView.Selected(true)); 
}) 
.Timezone("Etc/UTC") 
.DataSource(d => d 
    .Model(m => 
    { 

     m.Id(f => f.LeaveRequestId); 
     m.Field(f => f.Title).DefaultValue("No title"); 
     m.Field(f => f.EmployeeId).DefaultValue(1); 
     m.Field(f => f.Title).DefaultValue("No title"); 
     m.RecurrenceId(f => f.LeaveRequestId); 
    }) 
    .ServerOperation(true) 
    .Read(read => read.Action("Read", "Home").Data("getAdditionalData")) 
    .Create("Create", "Home") 
    .Destroy("Destroy", "Home") 
    .Update("Update", "Home") 
) 
    ) 

    <script> 

function getAdditionalData() { 
    var scheduler = $("#scheduler").data("kendoScheduler"); 

    var timezone = scheduler.options.timezone; 
    var startDate = kendo.timezone.convert(scheduler.view().startDate(), timezone, "Etc/UTC"); 
    var endDate = kendo.timezone.convert(scheduler.view().endDate(), timezone, "Etc/UTC"); 

    //optionally add startTime/endTime of the view 
    var startTime = kendo.date.getMilliseconds(scheduler.view().startTime()); 
    var endTime = kendo.date.getMilliseconds(scheduler.view().endTime()); 
    endTime = endTime == 0 ? kendo.date.MS_PER_DAY : endTime; 

    var result = { 
     Start: new Date(startDate.getTime() - (startDate.getTimezoneOffset() * kendo.date.MS_PER_MINUTE) + startTime), 
     End: new Date(endDate.getTime() - (endDate.getTimezoneOffset() * kendo.date.MS_PER_MINUTE) + endTime) 
    } 

    return result; 
} 
    </script> 
    <style> 
     .invalid-slot { 
      background: red !important; 
      cursor: no-drop; 
     } 
    </style> 


</div> 

但我不知道我需要在控制器和模型做的,如果有的話。

回答

0

我剛剛通過將其與SQL數據庫集成來完成KendoUI調度程序的實現。不過,我在我的MVC項目中使用了JavaScript API。

要載入數據,即「讀取」並執行插入,更新和刪除,只需從控制器返回JSON格式的模型。如果計劃程序獲得「知道」格式,則計劃程序將爲您綁定數據。

return Json(**censored**.Models.LeaveRequest, JsonRequestBehavior.AllowGet); 

幾個重要的點:
1. KendoUI調度依賴於唯一的ID很多,所以如果你有比「ID」等任何東西 - 然後「做」配置它在你的調度。 在JS API中,它使用以下語法完成,其中EventID是我的SQL表的唯一ID。

schema: { 
    model: { 
     "id": "EventID", 
     "fields": { 
      "EventID": { 
       "type": "number" 
      }, 
.... 
  • 始終從您的插入,更新返回JSON數據,並從控制器刪除方法。例如:

    公共JsonResult UpdateCalendarEvent(機型字符串) { ... 返回JSON(審查 .Models.LeaveRequest,JsonRequestBehavior.AllowGet); }

  • 在插入的情況下,在返回JSON對象之前,請使用最新的行ID更新ID或EventID,這樣Scheduler會同步客戶端的所有數據,並可以正確執行更新和刪除操作。

  • 希望幫助!