15 Dec to 22 Dec 2025: highlights of the new online resources that we published last week.

Article: https://www.telerik.com/aspnet-core-ui/documentation/knowledge-base/grid-ai-integration
Summary: Learn how to add AI integration to the Telerik UI for ASP.NET Core Grid by invoking OpenAI or Azure OpenAI to analyze grid data and display the response in a dialog. You will add a custom toolbar command, collect selected rows and column metadata on the client, call an ASP.NET Core controller that wraps the OpenAI REST API, and render the result in the UI. The article covers configuring OpenAI/Azure OpenAI, prompt construction, server-side API key handling, and basic error handling.

Article: https://www.telerik.com/aspnet-core-ui/documentation/knowledge-base/chart-ai-integration
Summary: Implement AI-assisted analysis for the Telerik/Kendo UI for ASP.NET Core Chart by extracting series data, sending it to an AI provider (e.g., OpenAI or Azure OpenAI) from a secure server-side controller, and rendering the generated summary in a UI element (such as a Dialog). The article provides Razor and controller examples using HttpClient and environment-stored API keys, plus guidance on prompt design, minimizing shared data, and keeping keys off the client.

Article: https://www.telerik.com/aspnet-core-ui/documentation/knowledge-base/editor-ai-integration
Summary: Learn how to integrate OpenAI or Azure OpenAI with the Telerik UI for ASP.NET Core Editor by adding a custom toolbar menu that posts the current content and selected action to a server-side ASP.NET Core endpoint, then inserts or replaces the text with the AI response. The article provides Editor configuration, JavaScript, and controller code that calls the Chat Completions API with prompt templates for rewrite, summarize, translate, and grammar fixes, keeping the API key on the server.

Article: https://www.telerik.com/aspnet-core-ui/documentation/knowledge-base/scheduler-ai-integration
Summary: Learn how to integrate the Telerik UI for ASP.NET Core Scheduler with an LLM-backed AI workflow to create, edit, translate, or summarize events from natural language. You’ll add the Kendo AI Prompt to the Scheduler UI, handle its execute event on the client, and implement a C# endpoint that calls an LLM (e.g., OpenAI or Azure OpenAI) and maps the JSON response to Scheduler events. The article includes end-to-end wiring, request/response shaping, and safe parsing to update the Scheduler data source.

Article: https://www.telerik.com/aspnet-core-ui/documentation/html-helpers/data-management/grid/smart-grid/smart-extensions
Summary: This article explains how to use Smart Extensions for the Telerik UI for ASP.NET Core Grid (Smart Grid) to apply preset configuration through extension methods on the Grid HtmlHelper. It covers setup (package and namespace), the available extensions and what they enable (such as filtering, sorting, paging, toolbars, commands, and column configuration), and how to customize or override defaults when composing Smart extensions with your own Grid settings.

Blog: https://www.telerik.com/blogs/managing-content-security-telerik-aspnet-core-applications
Summary: This article shows you how to add and enforce a Content Security Policy (CSP) in ASP.NET Core applications that use Telerik UI for ASP.NET Core, including setting security headers via middleware. It details the CSP directives and allowances required by the components—script-src, style-src, img-src, font-src, connect-src, worker-src, and support for blob: and data: URLs for features like file export—and how to use nonces/hashes and CSP‑compatible Telerik/Kendo assets to avoid 'unsafe-inline' and 'unsafe-eval'. You also get copy‑paste policy examples and troubleshooting guidance for scenarios such as CDN-hosted resources, PDF/Excel export, and WebSocket/SignalR connections.

---------------------------------------------------------------------------------------------------------------------------------------------------------

24 Nov to 01 Dec 2025: highlights of the new online resources that we published last week.

Blog: https://www.telerik.com/blogs/securing-apps-telerik-ui-aspnet-core-otp-control
Summary: You’ll implement one-time passcode (OTP/TOTP) verification in an ASP.NET Core app using the Telerik UI for ASP.NET Core OTP control, from configuring the control in Razor views to wiring server-side validation with ASP.NET Core Identity or a TOTP library. The article covers UX and security details—auto-advancing digit inputs, paste and accessibility, handling expiration and retries, and enforcing server-only validation, rate limiting, and secure secret storage—to build a reliable multi-factor authentication flow.

---------------------------------------------------------------------------------------------------------------------------------------------------------

17 Nov to 24 Nov 2025: highlights of the new online resources that we published last week.

Article: https://www.telerik.com/aspnet-core-ui/documentation/knowledge-base/chat-ai-integration
Summary: Integrate the Telerik UI for ASP.NET Core Chat with OpenAI or Azure OpenAI by handling the Chat send event, forwarding user messages to a server-side controller that calls the Chat Completions API, and returning the assistant’s reply as a Chat message. The article walks you through the Razor setup, controller/action implementation, secure API key handling, request/response models, role mapping (user/assistant), and basic error handling.

Blog: https://www.telerik.com/blogs/real-time-data-updates-telerik-ui-net-maui-grid
Summary: Learn how to implement real-time data updates in the Telerik UI for .NET MAUI Grid by binding to an ObservableCollection and models that implement INotifyPropertyChanged, so item additions/removals and per-cell changes propagate instantly. The article shows a timer-driven update loop and how to marshal background changes onto the UI thread, with practical guidance to keep frequent updates responsive.

---------------------------------------------------------------------------------------------------------------------------------------------------------

10 Nov to 17 Nov 2025: highlights of the new online resources that we published last week.

Article: https://www.telerik.com/aspnet-core-ui/documentation/ai-components-and-features
Summary: This article documents the AI Prompt and AI Chat components in Telerik UI for ASP.NET Core and shows you how to configure Tag/HTML Helpers and connect them to OpenAI or Azure OpenAI through ASP.NET Core endpoints. It covers setup, provider configuration, client/server APIs, streaming responses, attachments, context and message history, and content safety basics to help you implement AI features in your application.

Article: https://www.telerik.com/aspnet-core-ui/documentation/html-helpers/diagrams-and-maps/diagram/binding
Summary: You will bind the Telerik ASP.NET Core Diagram HTML Helper to your data so shapes and connections are generated from your schema. Configure DataSource and ConnectionsDataSource with model field mappings (Id, Text, X/Y for shape position; From/To for connections) and transport actions for server-side CRUD. The examples show remote binding, positioning, and handling data-bound events.

Article: https://www.telerik.com/aspnet-core-ui/documentation/html-helpers/diagrams-and-maps/diagram/razor-pages
Summary: This article shows how to use the ASP.NET Core Diagram HtmlHelper in Razor Pages: configure separate DataSources for shapes and connections with AJAX transport to page handlers (via Url.Page), map model fields (Id, From, To), and include the required Kendo UI scripts and styles. It provides .cshtml and PageModel code for Read, Create, Update, and Destroy operations and demonstrates adding anti-forgery tokens to the requests.

Feel free to check them out and share your thoughts!

The Telerik Team

1. Is it hard to understand the version numbers of our releases? If yes, what makes them hard to understand them?

2. Would semantic versioning (SemVer) of our releases make it easier to understand our version numbers and what's behind them?

3. If we go with SemVer, we might need to start with version 3000.0.0 as we currently use 2022.x.x. Please share your thoughts about this approach and ideas for what number versioning would work best for you.

Hi!

The ListView is breaking my web application, and I cannot make head or tail of the reason:

An unhandled exception occurred while processing the request.

Kendo.Mvc.UI.ListView<T>.VerifySettings()

Also, you demos for the ListView are broken and the browser tab crashed after a while.

I need an urgent fix, as this is affecting the live application.

In our UI for ASP.NET Core R3 2020 (2020.3.915) release, the Column menu message of unsticking a column is "null".

This bug will be resolved in our next official release.

In the meantime, as a workaround, manually set the Unstick Column menu message:

I have created a fresh project with the following variables:

• Visual Studio 22 Community (Version 17.14.21 )
• Progress Telerik UI for ASP.NET Core Extension 2025.4.1110.199
• .NET 9.0
• Kendo UI v2025.4.1111

I am trying to create a simple grid as following that has an editable `DateTime?` column:

https://netcorerepl.telerik.com/GpFmvpEr29UDYPJN54

It works in the REPL link above, but if I press "Edit" on my local project, the DateTime column defaults to a text input without the datetimepicker buttons (see Attachment-1.png), I'm not sure what I am missing.

I've checked that `/Views/Shared/Editor/Templates/DateTime.cshtml` exists and the content is as follows:

@model DateTime?

@(Html.Kendo().DateTimePickerFor(m => m).HtmlAttributes(new { title = Html.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldName("")}))

I've placed either `[DataType("Date")]` or `[DataType("DateTime")]` annotation on the class property definition and neither worked.

I've used `.EditorTemplateName("DateTime")` and/or `[UIHint("DateTime")]` and it didn't work.

I've created a new Template type and it didn't work.

I'm not sure what else to try to make it work.

Hello,

is there a possibility to support multitouch input on Pdf Viewer and Image Editor?

Moving and tapping is supported. So I can scroll through the pages for example. But I need to use zoom and pinch gesture for zooming in or out to documents / images also.

As we need to zoom just areas (e.g. maps with geo information) and keep the menus on top, the pages are not user-scalable as a whole:
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1,minimum-scale=1, user-scalable=no,text/html,charset=utf-8">

Is there any workaround to catch the event and set the zoom factor?

And is there a possibility to couple the mouse wheel / double click event to the zoom factor?

Thanks,

Christine

I seem to have hit a stumbling block which I cannot find a simple solution to.  Can someone point a direction for me to persue?

I am designing a website which will present to the user a tabbed interface.  Each tab will represent a collection of available options/items for the user to fill out when submitting changes to an edited object.

That sounds simple in concept.  I have used several host objects.  TabStrips, ExpansionPanels have been tried.  Both seem to render the same results.  Any "content" panels which are not rendered initially do not render properly when selected.

I.E., Tab #0 looks fine.  Tab#1, which is obscured/hidden, contains controls that when viewed lack things such as labels, icons, most script driven features.  The same logic fails when other non-tabstrip items used.

Here is a quicky sample showing the problem.  In theory, expansion panels 1, 2, and 3 should all render content.  Only panel #1 shows valid content, 2 and 3 are malformed at best.

My root problem seems to be my inability to dynamically show content not visible when the page is initially rendered.  Can someone point me the correct direction?  I have tried the "loadfrom" content options all having the same results.

            @(Html.Kendo().ExpansionPanel()
                        .Name("reoccurringItems")
                        .Title("Reoccurring")
                        .SubTitle("Items running more than one time")
                        .Expanded(false)
                        .Content("Test Text to test feature..")
                        )

            @(Html.Kendo().ExpansionPanel()
                        .Name("nonReoccurringItem")
                        .Title("Run Once")
                        .SubTitle("A item run one time only")
                        .Expanded(false)
                        .Content(@<text>
                <div>
                    @(Html.Kendo().DateTimePickerFor(m => m.OneTimeOccurrenceAtDateandTime)
                                  .Label(lbl => lbl.Content("Run Once At Date/Time").Floating(true))
                                  .Rounded(Rounded.Full).ToClientTemplate())
                </div>
            </text>)
                        )

            @(Html.Kendo().ExpansionPanel()
                        .Name("nonReoccurringTestItem")
                        .Title("Test Two")
                        .SubTitle("Test With Textbox")
                        .Expanded(false)
                        .Content(@<text>
                <div>
                    @(Html.Kendo().TextBoxFor(m => m.ScheduleDescription).Label(lbl => lbl.Content("Description").Floating(true)))
                </div>
            </text>)
                        )

It may be something I'm missing but I've built a multi-series chart with line and column data.  Since it is possible for the values on the bar to be negative, the issue I'm seeing is the category label is repeated, one for each series. Since I am also using zoom, if I zoom in and then back out, the duplicated label is now gone. I should also note that if I remove the label position, currently set as start, it will render only one but then having negative values makes that look bad.

What am I missing to stop the axis duplication?

Attached is the initial render of the chart as coded below.  

        <kendo-chart name="chart" >
            <chart-legend visible="true" position="Kendo.Mvc.UI.ChartLegendPosition.Bottom"></chart-legend>
            <series>
                <series-item type="Kendo.Mvc.UI.ChartSeriesType.Column" name="Amount" field="Amount" category-field="Period" color="#003399">
                    <labels visible="true" format="{0:c2}"></labels>
                    <tooltip visible="true" template="Date: #= dataItem.Period#<br />Amt: #= kendo.format('{0:c2}', dataItem.Amount) #"></tooltip>
                </series-item>
                <series-item type="Kendo.Mvc.UI.ChartSeriesType.Line" name="Total" field="RunningTotal" category-field="Period" color="#FF9900">
                    <labels visible="false" format="{0:c2}"></labels>
                    <tooltip visible="true" template="Date: #= dataItem.Period#<br />Total: #= kendo.format('{0:c2}', dataItem.RunningTotal) #"></tooltip>
                </series-item>
            </series>
            <datasource type="Kendo.Mvc.UI.DataSourceTagHelperType.Ajax" server-operation="true" page-size="0">
                <transport>
                    <read url="" />
                </transport>
                <sorts>
                    <sort field="Period" />
                </sorts>
            </datasource>
            <category-axis>
                <category-axis-item>
                    <labels position="ChartAxisLabelsPosition.Start" step="2">
                        <chart-category-axis-labels-rotation align="Kendo.Mvc.UI.ChartAxisLabelRotationAlignment.End" angle="315" />
                    </labels>
                    <chart-category-axis-item-title text="Date"></chart-category-axis-item-title>
                </category-axis-item>
            </category-axis>
            <value-axis>
                <value-axis-item>
                    <labels format="c0"></labels>
                </value-axis-item>
            </value-axis>
            <zoomable>
                <mousewheel lock="ChartAxisLock.Y" />
            </zoomable>
        </kendo-chart>

I am converting a MVC table grid to a Telerik Grid. While looking at it, there are conditional columns. For example: 

@if (Model?.GroupDetail?.IsMec == false)
                                    {
                                        <th class="text-secondary" style="width: 140px;">Group Info</th>
                                    }

<th class="text-secondary">
                                        @if (Model?.GroupDetail?.IsMec == false)
                                        {
                                            <text>Office</text>
                                        }
                                        else
                                        {
                                            <text>Role</text>
                                        }
                                    </th>