Cant display Data in Schedule

[Angel J Rosado]

I'm trying to show various scheduled items retrieved from a web service. Im passing them as JSON object to the view. When I tried to display them for some reason they arent working. I tried the examples and the all worked fine!. 

Here is an example of the JSON Object i have:

[{"Id":53,"Title":"Último día para aprobar certificación Seguridad y Salud en el Empleo","Description":"Por favor no dejar para último minuto. Recuerden que es un requisito compulsorio.","StartTime":"2014-12-31T04:00:00Z","EndTime":"2015-12-31T04:00:00Z","DisplayDate":null,"date":"2014-12-31T00:00:00-04:00","type":"Event","title":"Último día para aprobar certificación Seguridad y Salud en el Empleo","description":"Por favor no dejar para último minuto. Recuerden que es un requisito compulsorio."},{"Id":92,"Title":"Test Event","Description":"Descripcion Test","StartTime":"2015-07-31T04:00:00Z","EndTime":"2016-07-31T04:00:00Z","DisplayDate":null,"date":"2015-07-31T00:00:00-04:00","type":"Event","title":"Test Event","description":"Descripcion Test"}]

My HTML code is this:

 <div class="col-md-12">

    <div class="content-container-fluid">

        <div class="row">

            <div class="cols-sample-area">

                <div style="float: left" id="Schedule1">

                </div>

            </div>

        </div>

    </div>

    </div>

<script type="text/javascript">

       

        $(function () {

         

            var wd = '@Model';  //This is the JSON returned by ActionResult to the View

            console.log(wd);

            console.log('Model + @Model');

            var dManager = ej.DataManager(wd);

            $("#Schedule1").ejSchedule({

                width: "100%",

                height: "525px",

currentDate:new Date(Date.now()),

                appointmentSettings: {

                    // the dManager collections

                    dataSource: dManager,

                    id: "Id",

                    subject: "Subject",

                    startTime: "StartTime",

                    endTime: "EndTime",

                    description:"Description",

                    allDay: true,

                    recurrence: "Recurrence",

                    recurrenceRule: "RecurrenceRule"

                }

            });

        });

    </script>

With this code I get a blank calendar. No items in it

Thank you in advance

[Sarath Kumar P K]

Hi Angel,

Thank you for using Syncfusion products.

We would like to let you know that, if suppose the JSON object is directly passed to the view, then you can either assign it directly to the “dataSource” property of the Schedule or else you can use the datamanager code as we have highlighted below. While using DataManager, it is necessary to query the data objects using ej.Query() to get the data collection as mentioned below,

<code>

     console.log(wd);

            console.log('Model + @Model');

            var dManager = ej.DataManager(wd).executeLocal(ej.Query());

            $("#Schedule1").ejSchedule({

                width: "100%",

                height: "525px",

              ..........

</code>

For more details on Data Manager, refer the following link :

http://helpjs.syncfusion.com/js/datamanager/overview

Also, after checking with your provided code and JSON data, we found that you have mapped two of your fields (subject and allDay fields) wrongly. We request you to map the schedule appointment fields appropriately, so that the appointments will render correctly in the Schedule with the given data. Please refer the following code snippet to map the fields as per your given data,

<code>

appointmentSettings: {

                    dataSource: dManager,

                    id: "Id",

                    subject: "Title", // In your JSON data, you have used the field name as “Title” – therefore mapped it here.

                    startTime: "StartTime",

                    endTime: "EndTime",

                    description: "Description",

                    allDay: "AllDay", // Need to assign the mapper field name here, instead of assigning direct values like true.

                    recurrence: "Recurrence",

                    recurrenceRule: "RecurrenceRule"

                }

</code>

Note: If in case, you are not using the fields like allDay, recurrence and recurrenceRule in your JSON data object – then it is not necessary to map such field names to the appointmentSettings, you can simply ignore by not defining it.

Kindly try with the above things and please let us know if it works on your project and also let us know, if you need any further assistance on this.

Regards,

Sarath Kumar P K