ASP.NET Core Scheduler Not showing Remote Events

[Justin Orange]

HI.I am starting a new Project with ASP.NET core (9).. and have added the SyncFusion Scheduler Control to the page. It renders fine, but it doesn't seem to show events.I have a Remote Datasource, it seems to call the url fine, but will not show the events on the page. I have checked JSON format, and tried changing the format to be either anm object array.. or a result:[], count structure, neither seem to work. I'm not sure what I'm missing.
I have stripped the code to the bare minimum... with static data, and I still can't seem to get it to actually show anything

Sample Code
in the Razor Page
@{ 
var eventsDataManager = new DataManager()         {

             Url = "/Calendars/Scheduler/GetEvents",

             Adaptor = "UrlAdaptor",

             CrossDomain = true

         };

}
<ejs-schedule id="scheduler">

    <e-schedule-eventsettings dataSource="eventsDataManager">

    </e-schedule-eventsettings>

</ejs-schedule>

<ejs-scripts></ejs-scripts>

and the 'GetEvents' endpoint 
public override async Task HandleAsync(GetEventsRequest r, CancellationToken c)

 {     

     List<ExistingEventViewModel> appData =

     [

         new ExistingEventViewModel

         {

             Id = 1,

             Subject = "Paris",

             StartTime = new DateTime(2024, 11, 25, 10, 0, 0),

             EndTime = new DateTime(2024, 11, 25, 12, 30, 0)

         },

     ];

     GetEventsResponse response = new GetEventsResponse

     {

         Result = appData,

         Count = appData.Count

     };

     await SendAsync(response, cancellation: c);

 }

The get Data is a FastEndpoint

I can see in the browser that the request is made to the GetData Endpoint, and it returns JSON as follows

    "result": [

        {

            "id": 1,

            "subject": "Paris",

            "description": null,

            "startTime": "2024-11-25T10:00:00+13:00",

            "endTime": "2024-11-25T12:30:00+13:00",

            "startTimeZone": null,

            "endTimeZone": null,

            "location": null,

            "isAllDay": false,

            "recurrenceId": null,

            "recurrenceRule": null,

            "recurrenceException": null,

            "isReadonly": false,

            "isBlock": false

        }

    ],

    "count": 1

}

I have also changed it to return just an array
as such
[

    {

        "id": 1,

        "subject": "Paris",

        "description": null,

        "startTime": "2024-11-25T10:00:00+13:00",

        "endTime": "2024-11-25T12:30:00+13:00",

        "startTimeZone": null,

        "endTimeZone": null,

        "location": null,

        "isAllDay": false,

        "recurrenceId": null,

        "recurrenceRule": null,

        "recurrenceException": null,

        "isReadonly": false,

        "isBlock": false

    }

]


neither work, nothing is rendering in the Scheduler (and yes I am looking at the correct day)

I feel like I must be missing something simple.....

There is no errors or warnings in the Dev Tools Console

[Swathi Ravi]

Hi Justin,

Thank you for reaching out.

To resolve the issue, you're experiencing with the Syncfusion Scheduler not displaying events from the remote data source, you need to ensure the proper configuration of the JSON serialization settings. In ASP.NET Core, the default JSON format is Pascal Case, while the Syncfusion Scheduler expects camelCase properties for the event fields. This discrepancy is likely causing the issue.

Please try adding the following code to your Program.cs file to configure the JSON serialization correctly:

using Newtonsoft.Json;

using Newtonsoft.Json.Serialization;

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.

builder.Services.AddControllersWithViews();

builder.Services.AddControllersWithViews()

    .AddNewtonsoftJson(options =>

    {

        options.SerializerSettings.ContractResolver = new DefaultContractResolver(); 

    });

var app = builder.Build();

Reference: https://learn.microsoft.com/en-us/aspnet/core/web-api/advanced/formatting?view=aspnetcore-9.0#add-newtonsoftjson-based-json-format-support-2

Additionally, I've attached a runnable sample that demonstrates the correct setup and integration. If the issue persists, please let us know, and we'd be happy to assist further.

Regards,

Swathi

Attachment: CoreDotNet9Scheduler_3513e421.zip

[Justin Orange]

Its actually the other way around. The default serialization is camelCase and the Scheduler (seems) to expect PascalCase. Also it the standard .NET library for JSON serialization (System.Text.Json) , not newtonsoft anymore



which is

    builder.Services.AddControllers().AddJsonOptions(options =>

    {

        options.JsonSerializerOptions.PropertyNamingPolicy = null;

    });

and your example to use Newtonsoft, I don't think will work either, it uses camelCase serialization  by default as well.
You would need

services.AddControllers()
        .AddNewtonsoftJson(options =>
        {
            options.UseMemberCasing();
        });
 Copy

The last sample I did I followed the documentation to the letter, and it doesn't work. There is no mention of what the expected JSON serialization is for remote data, and all the examples seem to indicate that the property names are all camelCase..... 

[Swathi Ravi]

Justin,

 

Thank you for reaching out with your concern. We understand the confusion regarding JSON serialization and how it interacts with the Scheduler component.

 

The Scheduler component expects field names in PascalCase by default. However, the default JSON serialization in ASP.NET Core uses camelCase, which can lead to a mismatch. This behavior is not specific to the Scheduler but is a result of ASP.NET Core's default configuration for System.Text.Json.

 

To align the JSON serialization with the Scheduler's expected format, you can customize the property naming policy as follows:

 

builder.Services.AddControllers().AddJsonOptions(options =>

{

    options.JsonSerializerOptions.PropertyNamingPolicy = null;

});

 

 

If modifying the serialization settings isn't an option, you can map the Scheduler's field names to your JSON property names using the fieldMapping feature. Here's an example:

 

<ejs-schedule id="schedule" width="100%" height="550" selectedDate="DateTime.UtcNow">

    <e-schedule-eventsettings dataSource="dataManager">

        <e-eventsettings-fields id="id">

            <e-field-subject name="subject"></e-field-subject>

            <e-field-starttime name="startTime"></e-field-starttime>

            <e-field-endtime name="endTime"></e-field-endtime>

        </e-eventsettings-fields>

    </e-schedule-eventsettings>

</ejs-schedule>

 

For more information on customizing field mappings, please refer to our documentation on field names.

If you prefer using System.Text.Json, it also supports advanced customization for property naming policies. You can find more details in the official Microsoft documentation.

We hope this clarifies your query and provides the solution you need. Please let us know if you encounter any further issues—we’re here to help!