ASP.NET Core , Telerik grid, no data is displayed but controller action returns data

Question

In an ASP.NET MVC Core 3 project I have Telerik UI for ASP.NET Core.

I have hooked up a grid to a view, and the controller action is returning data, however the grid does not render the data.

I have subscribed to the error event on the grid, and that does not fire. I have also researched and it seems the way .NET Core handles serialization is the issue, between camel case and pascal case, so my Startup.cs has this:

services.AddControllersWithViews() 
    .AddJsonOptions(options =>
    {
        options.JsonSerializerOptions.PropertyNamingPolicy = null;

But the grid does not render any of the records returned.

Grid definition:

@(Html.Kendo().Grid<Web.Models.DemoQueueViewModel>().Name("grid")
    .Columns(columns =>
    {
        columns.Bound(c => c.FirstName);
    })
    .DataSource(dataSource => dataSource
        .Ajax()
        .Events(events => events.Error("error_handler"))
        .Model(model => 
        { 
            model.Id(p => p.Id);
        })
        .Read("GridRead", "DemoQueue")
    )
)

Answer 1

Perhaps the issue is related to the JSON serialization method, when using the System.Text.Json method to serialize the response data, it might not serialize the complex object.

Try to use Newtonsoft.Json to serialize response data, install the Microsoft.AspNetCore.Mvc.NewtonsoftJson via Nuget, and then using the following code:

services.AddControllersWithViews().AddNewtonsoftJson();