Sync with Kendo UI Professional

Author: Kendo Bot

docs-aspnet/backwards-compatibility/2022-backwards-compatibility.md

@@ -70,7 +70,7 @@ As of the 2022 R1 SP2 release the `Shape` configuration option of the Button com
 
 **Scheduler**
 
-As of the 2022 R1 SP1 release the Scheduler exposes a modified keyboard navigation behavior. The main reason behind the change is to make the widget a single Tab stop element on the page. This would allow easier navigation to and away from the Scheduler. Further details on the new keyboard navigation behavior could be found on the [Keyboard Navigation demo](https://demos.telerik.com/{{ site.platform }}/scheduler/selection).
+As of the 2022 R1 SP1 release the Scheduler exposes a modified keyboard navigation behavior. The main reason behind the change is to make the widget a single Tab stop element on the page. This would allow easier navigation to and away from the Scheduler. Further details on the new keyboard navigation behavior could be found on the [Keyboard Navigation demo](https://demos.telerik.com/{{ site.platform }}/scheduler/keyboard-navigation).
 
 ## {{ site.product }} 2022 R1
 

docs-aspnet/html-helpers/helper-basics/content-security-policy.md

@@ -60,9 +60,9 @@ Call the method after all components declarations to serialize the deferred init
 
 ### Creating Content Security Policy Templates
 
-Most of the components support templating options, which use the [Kendo UI Templates syntax](https://docs.telerik.com/kendo-ui/framework/templates/overview), for example, [Grid templates]({% slug htmlhelpers_grid_aspnetcore_templates_overview %}), [DropDownList templates]({% slug htmlhelpers_dropdownlist_templates_aspnetcore %}), and more. To avoid using the [inline](https://docs.telerik.com/kendo-ui/framework/templates/get-started-inline) and [external](https://docs.telerik.com/kendo-ui/framework/templates/get-started-external) Kendo UI templates and remove the `unsafe-eval` keyword from the `meta` tag of your Telerik UI for {{ site.framework }} application, you can define the templates in partial views and load them by using the overload of the template option that accepts {% if site.core %}`IHtmlContent`{% else %}`MvcHtmlString`{% endif %}. For more information on the CSP-Compatible templates, [refer to the Client Templates section]().
+Most of the components support templating options, which use the [Kendo UI Templates syntax](https://docs.telerik.com/kendo-ui/framework/templates/overview), for example, [Grid templates]({% slug htmlhelpers_grid_aspnetcore_templates_overview %}), [DropDownList templates]({% slug htmlhelpers_dropdownlist_templates_aspnetcore %}), and more. To avoid using the [inline](https://docs.telerik.com/kendo-ui/framework/templates/get-started-inline) and [external](https://docs.telerik.com/kendo-ui/framework/templates/get-started-external) Kendo UI templates and remove the `unsafe-eval` keyword from the `meta` tag of your Telerik UI for {{ site.framework }} application, you can define the templates in partial views and load them by using the overload of the template option that accepts {% if site.core %}`IHtmlContent`{% else %}`MvcHtmlString`{% endif %}. For more information on the CSP-compatible templates, [refer to the CSP-compatible templates section]({% slug client_templates_overview %}#content-security-policy-csp-templates).
 
-The example below demonstrates how to define a CSP-Compatible [client detail template of a Grid]({% slug clientdetailtemplate_grid_aspnetcore %}).
+The example below demonstrates how to define a CSP-compatible [client detail template of a Grid]({% slug clientdetailtemplate_grid_aspnetcore %}). You can pass either the relative or absolute path to the partial view in the `ClientDetailTemplateView` method.
 
 {% if site.core %}
 ```HtmlHelper
@@ -74,17 +74,69 @@ The example below demonstrates how to define a CSP-Compatible [client detail tem
             columns.Bound(product => product.CategoryName);
         })
         .Pageable()
-        .ClientDetailTemplate(await Html.PartialAsync("DetailTemplate"))
+        .ClientDetailTemplateView(await Html.PartialAsync("../GridPartials/DetailTemplate.cshtml")) // The "DetailTemplate.cshtml" is added in "~/Views/GridPartials/" directory.
         .DataSource(dataSource => dataSource
             .Ajax()
             .PageSize(20)
             .Read(read => read.Action("Categories_Read", "Home"))
         )
-        .Deferred()
     )
 
     @Html.Kendo().DeferredScriptFile()
 ```
+```TagHelper
+    @addTagHelper *, Kendo.Mvc
+
+    @{
+        // The "DetailTemplateTagHelper.cshtml" is added in "~/Views/GridPartials/" directory.
+        var detailTemplate = await Html.PartialAsync("../GridPartials/DetailTemplateTagHelper.cshtml");
+    }
+
+    <kendo-grid name="grid" detail-template-view="detailTemplate">
+        <columns>
+            <column field="CategoryID"/>
+            <column field="CategoryName"/>
+        </columns>
+        <pageable enabled="true"/>
+        <datasource type="DataSourceTagHelperType.Ajax" page-size="20">
+            <schema>
+                <model id="CategoryID">
+                    <fields>
+                        <field name="CategoryID" type="number"></field>
+                        <field name="CategoryName" type="string"></field>
+                    </fields>
+                </model>
+            </schema>
+            <transport>
+                <read url="@Url.Action("Categories_Read","Home")"/>
+            </transport>
+        </datasource>
+    </kendo-grid>
+```
+```DetailTemplateTagHelper.cshtml
+    // Partial View that contains the detail TagHelper Grid.
+    @addTagHelper *, Kendo.Mvc
+    @{
+        Layout = null;
+        var url = @Url.Action("Products_Read", "Home");
+    }
+
+    <kendo-grid name="grid_#=CategoryID#" is-in-client-template="true">
+        <columns>
+            <column field="ProductID"/>
+            <column field="ProductName"/>
+        </columns>
+        <datasource type="DataSourceTagHelperType.Ajax" page-size="20">
+            <schema data="Data" total="Total" errors="Errors">
+            </schema>
+            <transport>
+                <read url="@Html.Raw(url+"?categoryId=#=CategoryID#")" />
+            </transport>
+        </datasource>
+        <pageable enabled="true" />
+    </kendo-grid>
+
+```
 {% else %}
 ```HtmlHelper
     @(Html.Kendo().Grid<KendoGridClientHierarchy.Models.Category>()
@@ -95,19 +147,19 @@ The example below demonstrates how to define a CSP-Compatible [client detail tem
             columns.Bound(product => product.CategoryName);
         })
         .Pageable()
-        .ClientDetailTemplate(Html.Partial("DetailTemplate"))
+        .ClientDetailTemplateView(Html.Partial("../GridPartials/DetailTemplate.cshtml")) // The "DetailTemplate.cshtml" is added in "~/Views/GridPartials/" directory.
         .DataSource(dataSource => dataSource
             .Ajax()
             .PageSize(20)
             .Read(read => read.Action("Categories_Read", "Home"))
         )
-        .Deferred()
     )
 
     @Html.Kendo().DeferredScriptFile()
 ```
 {% endif %}
-```PartialView_DetailTemplate.cshtml
+```DetailTemplate.cshtml
+    // Partial View that contains the detail Grid.
     @{
         Layout = null;
     }
@@ -121,36 +173,14 @@ The example below demonstrates how to define a CSP-Compatible [client detail tem
         })
         .DataSource(dataSource => dataSource
             .Ajax()
+            .PageSize(20)
             .Read(read => read.Action("Products_Read", "Home", new { categoryId = "#=CategoryID#" }))
         )
         .Pageable()
+        .ToClientTemplate()
     )
 ```
 
-Alternatively, you can rewrite all [inline](https://docs.telerik.com/kendo-ui/framework/templates/get-started-inline) and [external](https://docs.telerik.com/kendo-ui/framework/templates/get-started-external) templates into [CSP-compatible functional templates](https://docs.telerik.com/kendo-ui/framework/templates/get-started-csp-templates).
-
-```HtmlHelper
-    @(Html.Kendo().Grid<KendoGridClientHierarchy.Models.Category>()
-        .Name("grid")
-        .Columns(columns =>
-        {
-            columns.Bound(product => product.CategoryName)
-              .ClientTemplate("<span>Name: ${kendo.htmlEncode(CategoryName)}</span>")
-        })
-        ...
-    )
-```
-{% if site.core %}
-```TagHelper
-    <kendo-grid name="grid">
-        <columns>
-            <column field="CategoryName" template="<span>Name: ${kendo.htmlEncode(CategoryName)}</span>"></column>
-        </columns>
-        ...
-    </kendo-grid>
-```
-{% endif %}
-
 The engine for the [inline](https://docs.telerik.com/kendo-ui/framework/templates/get-started-inline) and [external](https://docs.telerik.com/kendo-ui/framework/templates/get-started-external) templates will remain available. However, if you are using the previous template syntax, you must include the `usafe-eval` directive in the `meta` tag.
 
 ## (Prior to R1 2023 SP1) Working with Telerik UI for {{ site.framework }} Components
@@ -204,6 +234,7 @@ The Telerik UI for {{ site.framework }} releases prior to the R1 2023 SP1 one do
 
 ## See Also
 
+* [Content Security Policy (CSP) Templates]({% slug client_templates_overview %}#content-security-policy-(csp)-templates)
 * [Content Security Policy in Kendo UI for jQuery](https://docs.telerik.com/kendo-ui/troubleshoot/content-security-policy)
 * [Getting Started with Content Security Policy (CSP) Templates in Kendo UI for jQuery](https://docs.telerik.com/kendo-ui/framework/templates/get-started-csp-templates)
 

docs-aspnet/html-helpers/helper-basics/fundamentals-mvc.md

@@ -90,7 +90,7 @@ To defer individual components:
         @Html.Kendo().DeferredScriptsFor("age", false)
         </script>
 
-* Use the `DeferredScriptFile` method to serialize the deferred initialization script to a file.
+* Use the `DeferredScriptFile` method to serialize the deferred initialization script to a file. The method simulates loading the initialization scripts as a `JS` file through an `HttpModule`. To use this feature, enable the required settings described in the [deferring components globally section](#deferring-components-globally).
 
           @Html.Kendo().DeferredScriptFile()
 
@@ -124,7 +124,8 @@ To defer components globally:
     </configuration>
     ```
 
-1. Serialize the script tag into a file by adding `@(Html.Kendo().DeferredScriptFile())` after all components declarations. Any components registered after it will not be included in the script.
+1. Serialize the script tag into a file by adding `@(Html.Kendo().DeferredScriptFile())` after all components declarations. 
+Any components registered after it will not be included in the script.
 
     Alternatively, call the `DeferredScripts` method to format the components scripts as inline script.
 
@@ -228,22 +229,6 @@ If you have deferred the initialization of the component, make sure you get its
     });
     </script>
 
-## Using Client Templates
-
-By default, every Telerik UI helper renders a script element with an initialization statement. If the helper declaration is placed inside a Kendo UI template, the nested script elements will be invalid. The `ToClientTemplate` method instructs the helper to escape its own script element so that it can be nested.
-
-    <script id="template" type="text/x-kendo-template">
-        @(Html.Kendo().NumericTextBox()
-              .Name("age").ToClientTemplate()
-        )
-    </script>
-    <div id="container"></div>
-    <script>
-        $(function () {
-           var template = kendo.template($("#template").html());
-           $("#container").append( template ({}) );
-        })
-    </script>
 
 ## Rendering of Forms
 
@@ -323,5 +308,6 @@ The explanations and requirements in this section are applicable to all styleshe
 
 ## See Also
 
+* [Using Client Templates]({% slug client_templates_overview %})
 * [Telerik UI for ASP.NET MVC Download and Installation]({% slug downloadinstall_aspnetcore %})
 * [Installing Telerik UI for ASP.NET MVC with NuGet]({% slug nuget_install_aspnetmvc6_aspnetmvc %})

docs-aspnet/html-helpers/helper-basics/fundamentals.md

@@ -131,7 +131,8 @@ To defer individual components:
             @Html.Kendo().DeferredScriptsFor("age", false)
         </script>
 
-* Use the `DeferredScriptFile` method to serialize the deferred initialization script to a file.
+* Use the `DeferredScriptFile` method to serialize the deferred initialization script to a file. The method simulates loading the initialization scripts as a `JS` file through a middleware. To use this feature, enable the required settings described in the [deferring components globally section](#deferring-components-globally).
+ 
 
           @Html.Kendo().DeferredScriptFile()
 
@@ -144,6 +145,17 @@ To defer components globally:
 
 1. Enable the `DeferToScriptFiles` setting in the `AddKendo` method that registers the Kendo UI service.
 
+ * For applications using .NET 6 or later and the [minimal hosting model](https://docs.microsoft.com/en-us/aspnet/core/migration/50-to-60?view=aspnetcore-6.0&tabs=visual-studio#new-hosting-model), the `AddKendo` method is defined in the `Program.cs` file.
+
+	```
+	var builder = WebApplication.CreateBuilder(args);
+
+	builder.Services.AddKendo(x =>
+    {
+        x.DeferToScriptFiles = true;
+    });
+	```
+
  * For applications using .NET 5 or earlier, the `AddKendo` method is defined in the `ConfigureServices` method in the `Startup.cs` file.
 
 	```
@@ -156,17 +168,6 @@ To defer components globally:
 	}
 	```
 
- * For applications using .NET 6 or later and the [minimal hosting model](https://docs.microsoft.com/en-us/aspnet/core/migration/50-to-60?view=aspnetcore-6.0&tabs=visual-studio#new-hosting-model), the `AddKendo` method is defined in the `Program.cs` file.
-
-	```
-	var builder = WebApplication.CreateBuilder(args);
-
-	builder.Services.AddKendo(x =>
-    {
-        x.DeferToScriptFiles = true;
-    });
-	```
-
 1. Set the `KendoDefferedScriptsMiddleware` middleware. After the compilation of the views, all scripts are stored in the memory cache. When the browser requests the dynamic `js` file, this middleware handles the request and returns the cached scripts.
 
     ```
@@ -281,65 +282,8 @@ If you have deferred the initialization of the component, make sure you get its
 
 ```
 
-## Using Client Templates
-
-The Telerik UI for ASP.NET Core enables you to implement client templates for its [HTML Helper](#html-helper-client-templates) and [Tag Helper](#tag-helper-client-templates) components.
-
-### HTML Helper Client Templates
-
-By default, every Telerik UI helper renders a script element with an initialization statement. If the helper declaration is placed inside a Kendo UI template, the nested script elements will be invalid. The `ToClientTemplate` method instructs the helper to escape its own script element so that it can be nested.
-
-    <script id="template" type="text/x-kendo-template">
-        @(Html.Kendo().NumericTextBox()
-              .Name("age")
-              .ToClientTemplate()
-        )
-    </script>
-    <div id="container"></div>
-    <script>
-        $(function () {
-           var template = kendo.template($("#template").html());
-           $("#container").append( template ({}) );
-        })
-    </script>
-
-### Tag Helper Client Templates
-
-Тhe .NET framework ignores any Tag Helpers which are within script tags. In order to compile them correctly, when placing a Tag Helper within a Kendo Template, set the type to `text/html` and add the `is-in-client-template="true"` attribute.
-
-The following example demonstrates how to include Chart TagHelpers in the TileLayout TagHelper.
-
-        <!-- container chart templates -->
-        <script id="downloads-template" type="text/html">
-            <kendo-chart name="downloads" is-in-client-template="true">
-                <series>
-                    <series-item type="ChartSeriesType.Line" data="new double[] { 56000, 63000, 74000, 91000, 117000, 138000 }">
-                    </series-item>
-                </series>
-            </kendo-chart>
-        </script>
-        <script id="devices-template" type="text/html">
-            <kendo-chart name="devices" is-in-client-template="true">
-                <series>
-                    <series-item type="ChartSeriesType.Donut" auto-fit="true" data='new dynamic[] {
-                        new {category = "Asia",value = 30.8,color = "\\#006634"},
-                        new {category = "Europe",value = 69.2,color = "\\#90cc38"}}'>
-                    </series-item>
-                </series>
-            </kendo-chart>
-        </script>
-        <kendo-tilelayout name="tilelayout" columns="2" resizable="true" reorderable="true">
-            <containers>
-                <container body-template-id="downloads-template" col-span="1" row-span="1">
-                    <container-header text="Weekly Recap-Downloads" />
-                </container>
-                <container body-template-id="devices-template" col-span="1" row-span="1">
-                    <container-header text="Devices" />
-                </container>
-            </containers>
-        </kendo-tilelayout>
-
 ## See Also
 
+* [Using Client Templates]({% slug client_templates_overview %})
 * [JSON Serialization]({% slug jsonserialization_core %})
 * [Kendo UI Templates](https://docs.telerik.com/kendo-ui/framework/templates/overview)