Specifying schema for SchedulerDataSource using declarative data-* attributes

[Moiez]

Hi,

I need to use the Scheduler with declarative initialization (data-* attributes). I have a datasource called myDataSource, which is of type SchedulerDataSource(), initialized like this in a TypeScript file:

var myDataSource = new kendo.data.SchedulerDataSource();

I am using the following code snippet in the *.cshtml file. The
data-date, data-editable and data-views attributes work as expected:

<div id="scheduler" data-role="scheduler" data-date="2015/1/7" data-editable="true"

                 data-views=["day","week","month"] data-bind="myDataSource"

/>


My schema should look like this:

          schema: {
            model: {
                id: "projectId",
                fields: {
                    projectId: { from: "ProjectId", type: "number" },
                    title: { from: "QuoterName", defaultValue: "No title"},
                    start: { type: "date", from: "BidDate", defaultValue: "2015/1/7" },
                    end: { type: "date", from "BidDate", defaultValue: "2015/1/7" },
                    description: { from: "JobName" }
                }
            }
        }


The "from" above contains the exact field names in the class that retrieves from the database. Questions:

1. How would I declare the model attribute in the scheduler "div" tag above? Your online documentation shows
examples in a <script/> tag, but I need to use it declaratively (using data-* attributes).

2. What formats do the start and end (dates) need to be in? Our BidDate column returns 2015-01-08 12:00:00.0000000, for example. How should it be formatted for the start and end? For example, we have a standard 30-minute duration,
so 2015-01-08 12:00:00.0000000 would start at 12:00 pm and end at 12:30 pm on 2015-01-08. What date formats should be passed in?

3. Do all fields that are being returned need to be declared in the schema or only the ones that are being displayed?

Thanks!

[Moiez]

This is my declarative initialization. projectId, quoterName, biddate, etc are properties of the class that retrieves values from the database.

It displays a scheduler with a start date of 2015/1/6, views of Day, Week and Month, is editable (as defined by the data-* attributes), but still doesn't show appointments (there should be one on 2014/12/31 and one on 2015/1/6):

            <div id="scheduler" data-role="scheduler" data-date="2015/1/6" data-editable="true"
                 data-views="['day','week','month']"
                 data-bind="source: calendarData"
                 data-schema="model: {id: projectId,
                                      fields: {
                                                projectId: { 'from': 'projectId', 'type': 'number' },
                                                title: { 'from': 'quoterName', 'defaultvalue': 'No Title' },
                                                start: { 'from': 'bidDate', 'defaultvalue': '2015/1/7 6:00 PM' },
                                                end: { 'from': 'bidDate', 'defaultvalue': '2015/1/7 6:30 PM' },
                                                description: { 'from': 'jobName'},
                                            }
                            }" />

[Georgi Krustev]

Hello Moiez,

I have answered in the support thread opened on the subject. I would like to ask you continue our discussion in only one thread to avoid duplication. You can post updated to this thread once the problem is solved if you would like to share the solution for other users.

Here is a quote of the first answer:

In general, you would need to define the whole DataSource structure and pass it to the attribute. Although this approach is achievable, it will lead to hard to maintain widget declaration. I would suggest you check this help topic, that shows the possible way to initialize widgets from mark-up. Based on the given code snippets, I would suggest you configure your widget in this way:

<div id="scheduler" data-role="scheduler" data-date="2015/1/6" data-editable="true"
                 data-views="['day','week','month']"
                 data-bind="source: calendarData" />
.....

var viewmodel = kendo.observable({
  calendarData: new kendo.data.SchedulerDataSource({
       //setup data source here
       //add the data and model definition
  })
});

Regards,
Georgi Krustev
Telerik