diff --git a/docs-aspnet/getting-started-core/razor-pages.md b/docs-aspnet/getting-started-core/razor-pages.md index 4fc9edce363..78bead2a28d 100644 --- a/docs-aspnet/getting-started-core/razor-pages.md +++ b/docs-aspnet/getting-started-core/razor-pages.md @@ -17,14 +17,14 @@ The ASP.NET Razor Pages framework was introduced in ASP.NET Core 2.0 as an alter * The `@page` directive placed at the top of the page makes it a Razor Page. The page contains both HTML and server-side logic, which you include by using Razor syntax. * The `@model` directive specifies the type of the data that the page is expected to work with. The page uses the PageModel class itself as a view model. The required data is exposed as properties. -* The page handles requests directly, without using a controller. A naming convention is used to find the appropriate handler method to execute in the PageModel class. Handler methods are prefixed with the word `On` followed by the HTTP verb used for the request that they process: `OnGet`, `OnPost`, `OnGetAsync` and `OnPostAsync`. Following this convention, additional handlers can be included, for example `OnGetHelloWorld`. +* The page handles requests directly, without using a controller. A naming convention is used to find the proper handler method to execute in the PageModel class. Handler methods are prefixed with the word `On` followed by the HTTP verb used for the request that they process: `OnGet`, `OnPost`, `OnGetAsync` and `OnPostAsync`. Following this convention, additional handlers can be included, for example `OnGetHelloWorld`. * Razor Pages automatically implement anti-forgery validation, which protects against cross-site request forgery (XSRF/CSRF) attacks. You can find more information on Razor Pages in the [Microsoft Docs](https://docs.microsoft.com/en-us/aspnet/core/razor-pages/) ## Using Telerik UI for ASP.NET Core in a Razor Pages Project -There are two alternative approaches for adding Telerik UI for ASP.NET Core to a new Razor Pages project: +The two alternative approaches for adding Telerik UI for ASP.NET Core to a new Razor Pages project are: * Use the [Telerik Extensions for Visual Studio]({% slug newprojectwizards_visualstudio_aspnetcore %}) to create a new project. The [**GRID RAZOR PAGES**]({% slug newprojectwizards_visualstudio_aspnetcore %}#available-templates) template scaffolds a Razor Pages sample, which contains a Grid with enabled CRUD operations. The benefit of this approach is that the template will add the necessary configuration and dependencies automatically. You can focus on adding and configuring the UI components you need. * Use the default Visual Studio **ASP.NET Core Web App** template, which is based on the ASP.NET Razor Pages framework. Do not use the **Web Application (Model-View-Controller)** template. @@ -48,6 +48,19 @@ All Telerik UI for ASP.NET Core components are compatible with the ASP.NET Razor @Html.AntiForgeryToken() ``` +1. Configure the JSON serialization options of the application in the `Program.cs` file. For more information, refer to the [JSON Serialization article]({% slug jsonserialization_core %}). + + ```Program.cs + + var builder = WebApplication.CreateBuilder(args); + + // Add services to the container. + builder.Services.AddRazorPages().AddJsonOptions(options => options.JsonSerializerOptions.PropertyNamingPolicy = null); + builder.Services.AddKendo(); + ... + + ``` + 1. Declare the Grid and setup the CRUD URLs in its `DataSource` configuration. Set the DataSource `Model.Id` configuration. The URL in these methods must refer to the name of the handler method in the `PageModel`: @@ -304,7 +317,7 @@ Razor pages are automatically protected from [XSRF/CSRF](https://docs.microsoft. ## Known Limitations -Razor Pages use `Page` in their routing mechanism which interferes with `GET` requests made by the Kendo UI DataSource. As a result, only `POST` requests should be used when paging is required. +Razor Pages use `Page` in their routing mechanism which interferes with `GET` requests made by the Kendo UI DataSource. As a result, only `POST` requests must be used when paging is required. ## See Also diff --git a/docs-aspnet/html-helpers/data-management/grid/context-menu.md b/docs-aspnet/html-helpers/data-management/grid/context-menu.md index 39b5c1db95f..0ceba70bced 100644 --- a/docs-aspnet/html-helpers/data-management/grid/context-menu.md +++ b/docs-aspnet/html-helpers/data-management/grid/context-menu.md @@ -8,7 +8,7 @@ position: 15 # Context Menu -The {{site.product}} Grid provides a built-in ContextMenu to show the user available options, such as CRUD operations, selection and export options. A ContextMenu is shown when the user right-clicks on the Grid's table `body` or `head` elements. +The {{site.product}} Grid provides a built-in ContextMenu to show the user available options, such as CRUD operations, selection and export options. The ContextMenu opens when the user right-clicks on the Grid's table `body` or `head` elements. By default, the Context Menu of the Telerik UI Grid for {{ site.framework }} is disabled. @@ -118,7 +118,9 @@ The following example demonstrates how you can customize the Context Menu using ### Custom Commands -You can also register custom commands for the Context Menu. The following example demonstrates how to implement a custom command: +You can also register custom commands for the Context Menu. To add custom commands in the ContextMenu that opens when the user right-clicks on the Grid's table `body` element, use the `Body()` configuration. To add custom commands in the ContextMenu that opens when the user right-clicks on the Grid's table `header` element, use the `Head()` configuration. + +The following example demonstrates how to implement a custom command that appears in the table header ContextMenu. ```HtmlHelper @(Html.Kendo().Grid() @@ -127,7 +129,7 @@ You can also register custom commands for the Context Menu. The following exampl .Head(head => { head.Create(); head.Separator(); - head.Custom("myTool").Text("My Tool).Icon("gear"); + head.Custom("myTool").Text("My Custom Tool").Icon("gear"); // "myTool" is the name of the command that will be displayed as "My Custom Tool". }) ) ... @@ -140,7 +142,7 @@ You can also register custom commands for the Context Menu. The following exampl - + diff --git a/docs-aspnet/html-helpers/editors/editor/tools.md b/docs-aspnet/html-helpers/editors/editor/tools.md index 310d5316c71..7c0cf135faf 100644 --- a/docs-aspnet/html-helpers/editors/editor/tools.md +++ b/docs-aspnet/html-helpers/editors/editor/tools.md @@ -48,6 +48,7 @@ The following example demonstrates the default tool methods of the Editor. .FontName() .FontSize() .ForeColor() + .FormatPainter() .BackColor() .Pdf() .Print() @@ -152,6 +153,8 @@ The following example demonstrates the default tool methods of the Editor. + + diff --git a/docs-aspnet/html-helpers/layout/dialog/action-buttons.md b/docs-aspnet/html-helpers/layout/dialog/action-buttons.md index 9d68bbcd92c..a5c7ddd38cf 100644 --- a/docs-aspnet/html-helpers/layout/dialog/action-buttons.md +++ b/docs-aspnet/html-helpers/layout/dialog/action-buttons.md @@ -10,7 +10,48 @@ position: 3 The Dialog action buttons allow you to provide specific interaction to users. -Each button has a text and an action handler attached to it. Generally, each button closes the Dialog as its last action but you can cancel this from the custom action handler. The order of the values in the `Actions()` configuration method determines the order in which the action buttons are rendered in the Dialog. You can also define a button as `Primary(true)`. +Each defined button has a text and an action handler attached to it. By default, the action buttons close the Dialog, but you can prevent the Dialog from closing by setting the respective action handler to return `false`. + +```HtmlHelper + @(Html.Kendo().Dialog() + .Name("dialog") + .Title("Software Update") + ... + { + actions.Add().Text("Ok"); + actions.Add().Text("Cancel").Action("onCancel"); + }) + ) + + +``` +{% if site.core %} +```TagHelper + + + + + + + + + + + +``` +{% endif %} + +The order of the values in the `Actions()` configuration method determines the order in which the action buttons are rendered in the Dialog. You can also define a button as `Primary(true)`. The following example demonstrates how to set three action buttons in a Dialog with a `stretched` layout. The last button has an `Action()` event handler attached and is set as `Primary(true)`. diff --git a/docs-aspnet/html-helpers/layout/form/validation.md b/docs-aspnet/html-helpers/layout/form/validation.md index d32030bbb2f..f98719e0dbd 100644 --- a/docs-aspnet/html-helpers/layout/form/validation.md +++ b/docs-aspnet/html-helpers/layout/form/validation.md @@ -252,7 +252,7 @@ The following example demonstrates custom validation of the `LastName` and `Reti } ``` -## Custom Validation +## DataAnnotation Attributes The Form component supports DataAnnotation attributes and will configure the editors and the built-in validation based on the DataAnnotation attributes set for the model properties. The following table summarizes the supported DataAnnotation attributes: diff --git a/docs-aspnet/html-helpers/layout/window/use-iframe.md b/docs-aspnet/html-helpers/layout/window/use-iframe.md index 3c42e35cdf9..ec75a307ac0 100644 --- a/docs-aspnet/html-helpers/layout/window/use-iframe.md +++ b/docs-aspnet/html-helpers/layout/window/use-iframe.md @@ -8,10 +8,10 @@ position: 6 # Using iframe -You can force the Window to display its content in an `