After upgrading from 2.2 to 3.1 my grid control no longer works. I am available for a phone call if that is easier.
Note: I have success with Html.Kendo().Menu() but also failure on Html.Kendo().TreeList<Group>(). I verified I have valid data.
Project:
<Project Sdk="Microsoft.NET.Sdk.Web" ToolsVersion="15.0"> <PropertyGroup> <TargetFramework>netcoreapp3.1</TargetFramework> <AspNetCoreHostingModel>InProcess</AspNetCoreHostingModel> <AssemblyName>Gsi.Portal</AssemblyName> </PropertyGroup> <ItemGroup> <Content Update="nlog.config" CopyToOutputDirectory="PreserveNewest" /> </ItemGroup> <ItemGroup> <PackageReference Include="bootstrap" Version="4.5.0" /> <PackageReference Include="IdentityModel" Version="4.3.1" /> <PackageReference Include="IdentityServer4" Version="4.0.3" /> <PackageReference Include="Microsoft.ApplicationInsights" Version="2.14.0" /> <PackageReference Include="Microsoft.AspNetCore.Authentication" Version="2.2.0" /> <PackageReference Include="Microsoft.AspNetCore.Authentication.Abstractions" Version="2.2.0" /> <PackageReference Include="Microsoft.AspNetCore.Authentication.Cookies" Version="2.2.0" /> <PackageReference Include="Microsoft.AspNetCore.Authentication.OpenIdConnect" Version="3.1.6" /> <PackageReference Include="Microsoft.AspNetCore.Http.Extensions" Version="2.2.0" /> <PackageReference Include="Microsoft.AspNetCore.Identity" Version="2.2.0" /> <PackageReference Include="Microsoft.Azure.KeyVault.Core" Version="3.0.5" /> <PackageReference Include="Microsoft.Azure.Storage.Blob" Version="11.1.7" /> <PackageReference Include="Microsoft.VisualStudio.Web.CodeGeneration.Design" Version="3.1.3" /> <PackageReference Include="System.Text.Encodings.Web" Version="4.7.1" /> <PackageReference Include="System.Threading.Tasks.Extensions" Version="4.5.4" /> <PackageReference Include="Telerik.UI.for.AspNet.Core" Version="2020.2.617" /> <PackageReference Include="Newtonsoft.Json" Version="12.0.3" /> <PackageReference Include="Telerik.Web.PDF" Version="2020.2.617" /> <PackageReference Include="NLog.Web.AspNetCore" Version="4.9.2" /> </ItemGroup>Shared._Layout:
I note that on this training your header looks different than mine. Do I need to completely rework this?
https://docs.telerik.com/aspnet-core/getting-started/first-steps#adding-reference-to-kendomvcui
<head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>@Glossary.Company Portal - @ViewData["Title"]</title> <link href="https://kendo.cdn.telerik.com/2020.2.617/styles/kendo.bootstrap-v4.min.css" rel="stylesheet" type="text/css" /> <script src="https://kendo.cdn.telerik.com/2020.2.617/js/jquery.min.js"></script> <script src="https://kendo.cdn.telerik.com/2020.2.617/js/kendo.all.min.js"></script> <script src="https://kendo.cdn.telerik.com/2020.2.617/js/kendo.aspnetmvc.min.js"></script> <environment names="Development"> <link rel="stylesheet" type="text/css" href="~/lib/bootstrap/css/bootstrap.css" /> <link rel="stylesheet" type="text/css" href="~/css/site.css" /> </environment> <environment names="Staging,Production"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" asp-fallback-href="~/lib/bootstrap/css/bootstrap.min.css" asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" /> <link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" /> </environment> <link rel="stylesheet" type="text/css" href="~/css/GsiWebPortalBootstrapTheme.css" /></head>_ViewImports.cshtml
@using Gsi.Portal@using Kendo.Mvc.UI@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers@addTagHelper *, Kendo.Mvc
Grid:
@(Html.Kendo().Grid<Person>() .Name("grid") .Columns(columns => { columns.Command(command => command .Custom("Detail") .Click("goDetail")) .Width(Glossary.Portal.ButtonWidth); columns.Bound(p => p.FirstName); columns.Bound(p => p.LastName); }) .Pageable() .Sortable() .Scrollable() .HtmlAttributes(new { style = "height:550px;" }) .DataSource(dataSource => dataSource .Ajax() .PageSize(20) .Read(read => read.Action("IndexJson", "Users") .Data("getGridData")) .Model(m => m.Id(p => p.Id)) ))Callback:
if (response.IsSuccess){ var persons = response.Result; if (persons != null) { var dsResult = await persons.ToDataSourceResultAsync(request); return Json(dsResult); } else { return CustomResponseToError(response); }}
3 Answers, 1 is accepted
Hello Joel,
Thank you for sharing the Grid declaration along with the related Kendo UI code.
I looked into it and I can say it looks good.
Generally, Kendo UI for ASP.NET Core is tested on .Net Core 3.1 and it works correctly. Can you please elaborate sharing more information:
- Are there any JS errors or exceptions thrown?
- Is the problem related to the data not displayed in the Grid?
If the latter is the issue note that with ASP.NET Core 3.x there was a breaking change from Microsoft in the default JSON serialization options, thus we have added a section on configuring the JSON Serialization based on the framework version used:
If the above is not the case it would best if you can submit a support thread sharing a sample runnable page that clearly replicates and isolates the problem. This will help us investigate further.
Let me know if the above suggestion helps resolve the issue.
Regards,
Nikolay
Progress Telerik
Rank 2
Iron
Iron
Iron