DataTables break when I add Telerik UI for AspNet MVC

dwilliams

I added Telerik to a project of mine today and everything looked fine. My project uses IdentityManagerUI and I use Datatables to display the Roles and Users for adding editing, etc.

I went to check a role and DataTables threw up a cryptic error "DataTables warning: table id=usersTable - Requested unknown parameter 'id' for row 0, column 0. For more information about this error, please see http://datatables.net/tn/4.

I take Telerik back out of the project and everything is fine. Add it back in and I get the same error.

I am currently working in an MVC Core .NET 6 environment using EF6 and all that. I have looked everywhere to see what has changed and I can't find anything. I've stripped down the view to not include js or css from wwwroot or layouts, making sure I'm only using the Kendo references and I still have the problem

Anyone ever have this problem or have an idea of where I should look to see what's going on?

Thanks!!

kthorngren

The first step is to follow the troubleshooting steps found at the technote link in the error:
https://datatables.net/manual/tech-notes/4

I went to check a role and DataTables threw up a cryptic error

Can you provide more details of what happens when you check a role?

The error is an issue with the data structure (array or object) of the rows being added to Datatables and the Datatables column config (the use of columns.data or not). You will need to debug the data being added and compare it the Datatables config - see the technote. Or post a link to your page or a test case replicating the issue so we can help debug.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Or you can use the debugger and post the ID for the developers to look at.

Kevin

dwilliams

I have discovered the problem. In the following code I get the error for DataTables. This is the additional services Kendo/Telerik needs to work. If I comment out the .AddNewtonsoftJson everything returns back to normal and works. I will have to reach out to Telerik and see how I can get around this without breaking DataTables.

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

Thanks!

kthorngren

I'm not familiar with MVC but it sounds like you have two choices:

1. Make this change:

    services.AddMvc();

to

    services
        .AddMvc()
        .AddJsonOptions(options => options.SerializerSettings.ContractResolver = new DefaultContractResolver());

Or use the browser's network inspector tool to see what is actually returned in the JSON response and adjust your columns.data settings to match the case or the properties in the JSON.

Kevin