Inline Grid not showing records

[StuartLittle]

I would like to display a simple inline grid but for some reason the view is not able to display the data sent by controller.

public class Employee
    {
        public int EmployeeID { get; set; }
        public string Name { get; set; }
        public string NetworkID { get; set; }
        public DateTime SeniorityDate { get; set; }
        public string Shift { get; set; }
    }

public ActionResult Employees_Read([DataSourceRequest] DataSourceRequest request)
        {
            var employeeList = new List<Employee>()
            {
                new Employee
                {
                    EmployeeID = 1,
                    Name = "Bill",
                    NetworkID = "123",
                    SeniorityDate = DateTime.Now,
                    Shift = "Day"
                },
                new Employee
                {
                    EmployeeID = 2,
                    Name = "Gates",
                    NetworkID = "456",
                    SeniorityDate = DateTime.Now,
                    Shift = "Day"
                }
            };

            IQueryable<Employee> employees = employeeList.AsQueryable();
            DataSourceResult result = employees.ToDataSourceResult(request);
            return Json(result);
        }

 

 

@(Html.Kendo().Grid<EmployeeManagement.Models.Employee>()
        .Name("grid")
        .Columns(columns =>
        {
            columns.Bound(p => p.Name).Width(300);
            columns.Bound(p => p.NetworkID).Width(100);
            columns.Bound(p => p.SeniorityDate).Width(200);
            columns.Bound(p => p.Shift).Width(100);
            columns.Command(command => { command.Edit(); command.Destroy(); }).Width(300);
        })
        .ToolBar(toolbar => toolbar.Create())
        .Editable(editable => editable.Mode(GridEditMode.InLine))
        .Pageable()
        .Sortable()
        .Scrollable()
        .HtmlAttributes(new { style = "height:430px;" })
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(20)
            .Model(model => model.Id(p => p.EmployeeID))
            .Read(read => read.Action("Employees_Read", "Admin"))

        )
    )

There are no errors in Developer tools console.

In the network tab, I see the response.

Please let me know if I am missing anything?

Thank you

[StuartLittle]

Ok. So I was able to resolve this issue by replacing

services.AddControllersWithViews()

with

services
                .AddControllersWithViews()
                .SetCompatibilityVersion(CompatibilityVersion.Version_3_0)
                // Maintain property names during serialization. See:
                // https://github.com/aspnet/Announcements/issues/194
                .AddNewtonsoftJson(options => options.SerializerSettings.ContractResolver = new DefaultContractResolver());

in Startup.cs

Problem was case mismatch.

[Aleksandar]

Hello,

By default .NET Core will use camelCase for serializing the data, however, the Grid will expect the information to be in PascalCase. With .Net Core 3.0 Microsoft introduced an update of the JSON Serializer which is part of the System.Text.Json namespace. Details on the changes introduced are available on Microsoft's website:

https://docs.microsoft.com/en-us/aspnet/core/migration/22-to-30?view=aspnetcore-2.2&tabs=visual-studio#jsonnet-support

Thus, in order for the data to be passed to the Grid in the expected format, the JSON Serialization needs to be configured. You could read more on the Environment Specifics section of the documentation and follow the approach described there.

Regards,
Aleksandar
Progress Telerik