This is a migrated thread and some comments may be shown as answers.

Scheduler datasource with WebApi JSON not working

1 Answer 433 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
ruud
Top achievements
Rank 1
ruud asked on 02 Aug 2013, 12:06 PM
Hi,

I can't seem to get the Scheduler datasource read operation to work.

Scheduler initialization:
self.scheduler = $('#scheduler').kendoScheduler({
                views: ["day", { type: "week", selected: true }, "month", "agenda"],
                culture: "nl-NL",
                allDaySlot: false,
                majorTick: 60,
                minorTickCount: period.CustomersPerHour != 0 ? period.CustomersPerHour : 4,
                date: new Date(period.From),
                startTime: new Date("2013/6/6 08:00"),
                endTime: new Date("2013/6/6 21:00"),
                editable: {
                    template: $("#editor").html()
                },
                dataSource: {
                    batch: false,
                    transport: {
                        read: {
                            url: "/api/appointment",
                            dataType: "json"
                        },
                        update: {
                            url: "/api/appointment/update",
                            dataType: "json"
                        },
                        create: {
                            url: "/api/appointment/create/?periodId=" + period.Id + '&periodType=' + period.$type,
                            dataType: "json",
                            contentType: "application/json"
                        },
                        destroy: {
                            url: "/api/appointment/destroy",
                            dataType: "json"
                        },
                    },
                    schema: {
                        model: {
                            Id: "Id",
                            fields: {
                                Id: {
                                    from: "Id",
                                    type: "number"
                                },
                                Title: {
                                    from: "Title",
                                    defaultValue: "No title",
                                    validation: {
                                        required: true
                                    }
                                },
                                Description: {
                                    from: "Description"
                                },
                                Start: {
                                    type: "date",
                                    from: "Start"
                                },
                                End: {
                                    type: "date",
                                    from: "End"
                                },
                                IsAllDay: {
                                    type: "boolean",
                                    from: "IsAllDay"
                                }
                            }
                        }
                    }
                },
            }).data("kendoScheduler");

WebApi code (the WebApi is set to return JSON):
[HttpGet]
public IEnumerable<Appointment> Get()
{
      return this.unitOfWork.Repository<Appointment>().Get;
}

WebApi response:
[{"$type":"Banden_Inn.Data.Entities.Models.Appointment, Banden-Inn.Data.Entities","Title":"Afspraak 1","Description":null,"Start":null,"End":null,"IsAllDay":false,"Id":1,"Created":"2013-08-02T13:58:33.853","Edited":null},{"$type":"Banden_Inn.Data.Entities.Models.Appointment, Banden-Inn.Data.Entities","Title":"Afspraak 2","Description":null,"Start":null,"End":null,"IsAllDay":false,"Id":2,"Created":"2013-08-02T13:58:33.857","Edited":null}]

Appointment entity (Base class contains id, created etc..):
public class Appointment : Base
    {
        public string Title { get; set; }

        public string Description { get; set; }

        public DateTime? Start { get; set; }

        public DateTime? End { get; set; }

        public bool IsAllDay { get; set; }
    }

What am I doing wrong? I'm missing something, but can't seem to figure out what?!
Thanks in advance!


Kind regards,
Ruud Prinsen

1 Answer, 1 is accepted

Sort by
0
Jayesh Goyani
Top achievements
Rank 2
answered on 02 Aug 2013, 02:16 PM
Hello,

I am not able to find the error in your code. but can you please try with below code snippet.  In this code i removed some unnecessary property
 and only bind the data to the scheduler.

 

My code is:

<script>
    $(function () {
        function scheduler_dataBinding(e) {
 
        }
 
        function scheduler_dataBound(e) {
 
        }
 
        function scheduler_save(e) {
 
        }
 
        function scheduler_remove(e) {
 
        }
 
        function scheduler_cancel(e) {
 
        }
 
        function scheduler_edit(e) {
 
        }
 
        $("#scheduler").kendoScheduler({
            date: new Date("2013/8/2"),
            startTime: new Date("2013/6/13 7:00"),
            height: 400,
            timezone: "Etc/UTC",
            views: [
            "day",
            { type: "week", selected: true },
            "month",
            "agenda"
        ],
            dataBinding: scheduler_dataBinding,
            dataBound: scheduler_dataBound,
            save: scheduler_save,
            remove: scheduler_remove,
            edit: scheduler_edit,
            cancel: scheduler_cancel,
            dataSource: {
                batch: true,
                transport: {
                    read: {
                        url: "/api/Products",
                        dataType: "json"
                    },
                    parameterMap: function (options, operation) {
                        if (operation !== "read" && options.models) {
                            return { models: kendo.stringify(options.models) };
                        }
                    }
                },
                schema: {
                    model: {
                        id: "Id",
                        fields: {
                            taskID: { from: "Id", type: "number" },
                            title: { from: "Title", defaultValue: "No title", validation: { required: true} },
                            start: { type: "date", from: "StartDate" },
                            end: { type: "date", from: "EndDate" },
                            //                            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" }
                        }
                    }
                }
            }
        });
    });
</script>

My web api response.
[{"Id":1,"StartDate":"2013-08-02T19:27:27.2083138+05:30","EndDate":"2013-08-02T20:27:27.2083138+05:30","Title":"title1","Description":"description1","IsAllDay":false},{"Id":2,"StartDate":"2013-08-03T05:27:27.2083138+05:30","EndDate":"2013-08-03T06:27:27.2083138+05:30","Title":"title2","Description":"description2","IsAllDay":false},{"Id":3,"StartDate":"2013-08-03T15:27:27.2083138+05:30","EndDate":"2013-08-03T16:27:27.2083138+05:30","Title":"title3","Description":"description3","IsAllDay":false}]


Note : Not sure but may be issue raised because of "$type" property in json result.

Thanks,
Jayesh Goyani
Tags
Scheduler
Asked by
ruud
Top achievements
Rank 1
Answers by
Jayesh Goyani
Top achievements
Rank 2
Share this question
or