Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion _contentTemplates/common/popup-edit-customization.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
| --- | --- | --- |
| `Class` | `string` | The CSS class of the edit popup |
| `Title` | `string` | The title of the edit popup |
| `ThemeColor` | `string` | The color scheme of the window. Use the available members of the static class [`ThemeConstants.Window.ThemeColor`](/blazor-ui/api/Telerik.Blazor.ThemeConstants.Window.ThemeColor). |
| `ThemeColor` | `string` | The color scheme of the window. Use the available members of the static class [`ThemeConstants.Window.ThemeColor`](slug://Telerik.Blazor.ThemeConstants.Window.ThemeColor). |
| `Width` | `string` | The Width of the edit popup |
| `MaxWidth` | `string` | The maximum width of the window |
| `MinWidth` | `string` | The minimum width of the window |
Expand Down
18 changes: 9 additions & 9 deletions common-features/data-binding/descriptors.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ You can obtain the applied filtering, searching, sorting, and grouping criteria

### Through the OnRead Event

Use the [`Request` property](slug://common-features-data-binding-onread#event-argument) of the [`OnRead` event argument object](/blazor-ui/api/Telerik.Blazor.Components.ReadEventArgs):
Use the [`Request` property](slug://common-features-data-binding-onread#event-argument) of the [`OnRead` event argument object](slug://Telerik.Blazor.Components.ReadEventArgs):

<div class="skip-repl"></div>

Expand Down Expand Up @@ -83,17 +83,17 @@ See the [complete example](#example-with-component-state) at the bottom of the a

## Filtering

The `args.Request.Filters` and the `args....State.FilterDescriptors` are collections of [`IFilterDescriptor`](/blazor-ui/api/Telerik.DataSource.IFilterDescriptor). To access the filtering criteria, such as the user input to filter by, cast each `IFilterDescriptor` from the respective collection:
The `args.Request.Filters` and the `args....State.FilterDescriptors` are collections of [`IFilterDescriptor`](slug://Telerik.DataSource.IFilterDescriptor). To access the filtering criteria, such as the user input to filter by, cast each `IFilterDescriptor` from the respective collection:

* If the component is of type input or select, such as the AutoComplete, ComboBox, DropDownList, MultiColumnComboBox, MultiSelect, cast the first `IFilterDescriptor` from the collection to [`FilterDescriptor`](/blazor-ui/api/telerik.datasource.filterdescriptor).
* Otherwise, cast each `IFilterDescriptor` from the `args.Request.Filters` collection, respectively from the `args....State.FilterDescriptors` collection, to [`CompositeFilterDescriptor`](/blazor-ui/api/Telerik.DataSource.CompositeFilterDescriptor).
* If the component is of type input or select, such as the AutoComplete, ComboBox, DropDownList, MultiColumnComboBox, MultiSelect, cast the first `IFilterDescriptor` from the collection to [`FilterDescriptor`](slug://telerik.datasource.filterdescriptor).
* Otherwise, cast each `IFilterDescriptor` from the `args.Request.Filters` collection, respectively from the `args....State.FilterDescriptors` collection, to [`CompositeFilterDescriptor`](slug://Telerik.DataSource.CompositeFilterDescriptor).

### CompositeFilterDescriptor

The `CompositeFilterDescriptor` exposes:

* The [`FilterDescriptors`](/blazor-ui/api/telerik.datasource.compositefilterdescriptor#Telerik_DataSource_CompositeFilterDescriptor_FilterDescriptors) property. This property represents another collection of `IFilterDescriptor`. To access the filtering criteria, cast each `IFilterDescriptor` to a `FilterDescriptor`. When the Filter component gets groupable filtering, cast each `IFilterDescriptor` to another `CompositeFilterDescriptor`.
* The [`LogicalOperator`](/blazor-ui/api/telerik.datasource.compositefilterdescriptor#Telerik_DataSource_CompositeFilterDescriptor_LogicalOperator) property. This property can be either `AND` or `OR`. This property represents the logical operator applied between the instances in the `FilterDescriptors` collection.
* The [`FilterDescriptors`](slug://telerik.datasource.compositefilterdescriptor#Telerik_DataSource_CompositeFilterDescriptor_FilterDescriptors) property. This property represents another collection of `IFilterDescriptor`. To access the filtering criteria, cast each `IFilterDescriptor` to a `FilterDescriptor`. When the Filter component gets groupable filtering, cast each `IFilterDescriptor` to another `CompositeFilterDescriptor`.
* The [`LogicalOperator`](slug://telerik.datasource.compositefilterdescriptor#Telerik_DataSource_CompositeFilterDescriptor_LogicalOperator) property. This property can be either `AND` or `OR`. This property represents the logical operator applied between the instances in the `FilterDescriptors` collection.

When the filtering is initiated, the `CompositeFilterDescriptor` properties get different values depending on the filter mode:

Expand All @@ -112,16 +112,16 @@ The searching criteria in a Grid or TreeList are stored in an individual `IFilte

## Sorting

The sorting criteria in a Grid, TreeList or Gantt are stored in a collection of [`SortDescriptor`](/blazor-ui/api/telerik.datasource.sortdescriptor) objects. Each `SortDescriptor` instance gives access to:
The sorting criteria in a Grid, TreeList or Gantt are stored in a collection of [`SortDescriptor`](slug://telerik.datasource.sortdescriptor) objects. Each `SortDescriptor` instance gives access to:
* The `Member`&mdash;The field where the user sorts.
* The `SortDirection`&mdash;The sort direction for this sort descriptor.

When the [`SortMode`](/blazor-ui/api/Telerik.Blazor.SortMode) is `Multiple`, you may need to consider the order of the `SortDescriptor` instances. The first applied sorting criteria take precedence over all others. If there are equal values in the first sorted items, then those items are sorted by the following sorting criteria.
When the [`SortMode`](slug://Telerik.Blazor.SortMode) is `Multiple`, you may need to consider the order of the `SortDescriptor` instances. The first applied sorting criteria take precedence over all others. If there are equal values in the first sorted items, then those items are sorted by the following sorting criteria.


## Grouping

Тhe grouping criteria for each group are stored in an individual collection of [`GroupDescriptor`](/blazor-ui/api/telerik.datasource.groupdescriptor) objects. The `GroupDescriptor` class inherits the `SortDescriptor` class and gives access to the same properties as the `SortDescriptor` class.
Тhe grouping criteria for each group are stored in an individual collection of [`GroupDescriptor`](slug://telerik.datasource.groupdescriptor) objects. The `GroupDescriptor` class inherits the `SortDescriptor` class and gives access to the same properties as the `SortDescriptor` class.

The user may group by multiple fields. The groups for subsequent fields will be nested within their parent groups. The grouping criteria from the parent group are stored in the first `GroupDescriptor` instance from the collection.

Expand Down
10 changes: 5 additions & 5 deletions common-features/data-binding/onread.md
Original file line number Diff line number Diff line change
Expand Up @@ -67,15 +67,15 @@ Components like the [**TreeList**](slug://treelist-data-binding-load-on-demand)

## Event Argument

The `OnRead` event handler receives an argument, which inherits from [`ReadEventArgs`](/blazor-ui/api/Telerik.Blazor.Components.ReadEventArgs). The exact type depends on the component. For example, the Grid handler receives `GridReadEventArgs`. The ComboBox handler receives `ComboBoxReadEventArgs`, and so on.
The `OnRead` event handler receives an argument, which inherits from [`ReadEventArgs`](slug://Telerik.Blazor.Components.ReadEventArgs). The exact type depends on the component. For example, the Grid handler receives `GridReadEventArgs`. The ComboBox handler receives `ComboBoxReadEventArgs`, and so on.

The following properties of the event argument object are common for all [components with an `OnRead` event](#components-with-onread-event). Other properties are discussed in component-specific articles.

@[template](/_contentTemplates/common/parameters-table-styles.md#table-layout)

| Property | Type | Description |
| --- | --- | --- |
| `Request` | [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) | This object carries information about the requested data items. It will reveal the page index or virtual scroll offset, the sorting and filtering state, etc. |
| `Request` | [`DataSourceRequest`](slug://Telerik.DataSource.DataSourceRequest) | This object carries information about the requested data items. It will reveal the page index or virtual scroll offset, the sorting and filtering state, etc. |
| `Data` | `IEnumerable` | Set it to the **chunk** of data items, which the component will **render**. |
| `Total` | `int` | Set it to the **total number** of items. This value will help the component generate its **pager** or **virtual scrollbar** correctly. |

Expand All @@ -102,11 +102,11 @@ async Task GridReadHandler(GridReadEventArgs args)

## ToDataSourceResult Method

The [`DataSourceRequest` object](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) provides information about the needed data. The question is how to retrieve this data most easily. Sometimes `OnRead` data binding is called "manual", but in most cases it doesn't have to be manual at all. The solution is **`ToDataSourceResult`**.
The [`DataSourceRequest` object](slug://Telerik.DataSource.DataSourceRequest) provides information about the needed data. The question is how to retrieve this data most easily. Sometimes `OnRead` data binding is called "manual", but in most cases it doesn't have to be manual at all. The solution is **`ToDataSourceResult`**.

The `ToDataSourceResult` extension method is able to extract the requested data items from `IEnumerable`, `IQueryable` and `DataTable`. The method is part of the [Telerik.DataSource.Extensions](/blazor-ui/api/Telerik.DataSource.Extensions) namespace. It expects a `DataSourceRequest` argument.
The `ToDataSourceResult` extension method is able to extract the requested data items from `IEnumerable`, `IQueryable` and `DataTable`. The method is part of the [Telerik.DataSource.Extensions](slug://Telerik.DataSource.Extensions) namespace. It expects a `DataSourceRequest` argument.

`ToDataSourceResult` returns a [`DataSourceResult` object](/blazor-ui/api/Telerik.DataSource.DataSourceResult). Its most important properties are:
`ToDataSourceResult` returns a [`DataSourceResult` object](slug://Telerik.DataSource.DataSourceResult). Its most important properties are:

| Property | Type | Description |
| --- | --- | --- |
Expand Down
6 changes: 3 additions & 3 deletions common-features/data-binding/telerik-datasource-package.md
Original file line number Diff line number Diff line change
Expand Up @@ -37,15 +37,15 @@ If you are using an EntityFramework backend that provides an `IQueryable` collec

The following classes and extension methods are the key components to the package:

* The `ToDataSourceResult(DataSourceRequest request)` [extension method](/blazor-ui/api/Telerik.DataSource.Extensions.QueryableExtensions) - this method is in the `Telerik.DataSource.Extensions` namespace, and is available for `IQueryable`, `IEnumerable` and `DataTable`. It receives a `DataSourceRequest` argument and returns a `DataSourceResult` object. It also has an async version (with the standard `Async` suffix to the method name). This is the method that facilitates the data operations itself so you don't have to implement them. These methods are in the `Telerik.DataSource.Extensions` namespace.
* The `ToDataSourceResult(DataSourceRequest request)` [extension method](slug://Telerik.DataSource.Extensions.QueryableExtensions) - this method is in the `Telerik.DataSource.Extensions` namespace, and is available for `IQueryable`, `IEnumerable` and `DataTable`. It receives a `DataSourceRequest` argument and returns a `DataSourceResult` object. It also has an async version (with the standard `Async` suffix to the method name). This is the method that facilitates the data operations itself so you don't have to implement them. These methods are in the `Telerik.DataSource.Extensions` namespace.

* The `ToDataSourceResult` method generates a LINQ expressions based on the `DataSourceRequest` and passes them to the `IQueryable.Provider`. It is up to the provider (collection) to resolve it and execute it against the database (for example, an `IQueryable` coming from an EntityFrameworkCore context will create and run an SQL query for you).

* [`DataSourceRequest`](/blazor-ui/api/Telerik.DataSource.DataSourceRequest) - the class that describes the request for data - what page index, page size, filters and sorts, groups and aggregates are required by the client. You can receive it from Telerik components (such as the [Blazor grid in its manual data operations mode](slug://components/grid/manual-operations)), or over the wire and deserialize it (such as for requests coming from widgets like the [UI for ASP.NET Core Grid with remote data](https://demos.telerik.com/aspnet-core/grid/remote-data-binding)). You can even create a `new` instance of the object and populate its fields according to some other business logic (like an OData query string or some other case). This object is in the `Telerik.DataSource` namespace.
* [`DataSourceRequest`](slug://Telerik.DataSource.DataSourceRequest) - the class that describes the request for data - what page index, page size, filters and sorts, groups and aggregates are required by the client. You can receive it from Telerik components (such as the [Blazor grid in its manual data operations mode](slug://components/grid/manual-operations)), or over the wire and deserialize it (such as for requests coming from widgets like the [UI for ASP.NET Core Grid with remote data](https://demos.telerik.com/aspnet-core/grid/remote-data-binding)). You can even create a `new` instance of the object and populate its fields according to some other business logic (like an OData query string or some other case). This object is in the `Telerik.DataSource` namespace.

* When you receive such an object from a Telerik component, you can iterate over the information it provides and implement you own data source operations, you are not obliged to use the `ToDataSourceResult` method (but it helps shape the data accordingly, so you may want to examine its `DataSourceResult` from a simple run to see what it contains).

* [`DataSourceResult`](/blazor-ui/api/Telerik.DataSource.DataSourceResult) - the resulting data set from the operations on the data source. It will contain the current page of data, for its appropriate index, according to the designated filters, sorts, groups; and it will also contain the total number of items in the data source. It will also contain aggregate data. This is what you would normally serialize over the wire to send back to the client (or pass by reference in case of C#-only services). This object is in the `Telerik.DataSource` namespace.
* [`DataSourceResult`](slug://Telerik.DataSource.DataSourceResult) - the resulting data set from the operations on the data source. It will contain the current page of data, for its appropriate index, according to the designated filters, sorts, groups; and it will also contain the total number of items in the data source. It will also contain aggregate data. This is what you would normally serialize over the wire to send back to the client (or pass by reference in case of C#-only services). This object is in the `Telerik.DataSource` namespace.



Expand Down
10 changes: 5 additions & 5 deletions common-features/icons.md
Original file line number Diff line number Diff line change
Expand Up @@ -105,8 +105,8 @@ The `TelerikFontIcon` component can show a [built-in Telerik Blazor font icon](#
| `Flip` | `IconFlip` `enum` <br /> (`None`) | The icon's flip direction, which allows to mirror (turn over) the image horizontally, vertically, or in both directions. |
| `Icon` | `FontIcon` `enum` | Any of the [built-in Telerik Blazor font icons](#icons-list). This parameter takes precedence over `IconClass`, if both are set. |
| `IconClass` | `string` | Custom CSS class for a custom third-party icon. Do not use together with the `Icon` parameter. |
| `Size` | `string` <br /> (`"md"`) | Any of the predefined icon sizes (from `"xs"` to `"xxxl"`). It is possible to set the parameter value to raw strings such as `"lg"`, `"md"`, or `"sm"`. However, the recommended practice is to use the properties of the static [`ThemeConstants.FontIcon.Size` class](/blazor-ui/api/telerik.blazor.themeconstants.fonticon.size). |
| `ThemeColor` | `string` | Any of the predefined icon colors. Use the static [`ThemeConstants.FontIcon.ThemeColor` class](/blazor-ui/api/telerik.blazor.themeconstants.fonticon.themecolor) properties. By default, the icon color will inherit the current CSS text color. |
| `Size` | `string` <br /> (`"md"`) | Any of the predefined icon sizes (from `"xs"` to `"xxxl"`). It is possible to set the parameter value to raw strings such as `"lg"`, `"md"`, or `"sm"`. However, the recommended practice is to use the properties of the static [`ThemeConstants.FontIcon.Size` class](slug://telerik.blazor.themeconstants.fonticon.size). |
| `ThemeColor` | `string` | Any of the predefined icon colors. Use the static [`ThemeConstants.FontIcon.ThemeColor` class](slug://telerik.blazor.themeconstants.fonticon.themecolor) properties. By default, the icon color will inherit the current CSS text color. |

>caption Using TelerikFontIcon

Expand Down Expand Up @@ -200,9 +200,9 @@ The `TelerikSvgIcon` component can show a [built-in Telerik Blazor SVG icon](#ic
|---|---|---|
| `Flip` | `IconFlip` `enum` <br /> (`None`) | The icon's flip direction, which allows to mirror (turn over) the image horizontally, vertically, or in both directions. |
| `Icon` | `ISvgIcon` | Assign a property of the `SvgIcon` static class to use any of the [built-in Telerik Blazor font icons](#icons-list). Alternatively, [implement your own custom SVG Icon class](#use-custom-svg-icon-collection). |
| `Size` | `string` <br /> (`"md"`) | Any of the predefined icon sizes (from `"xs"` to `"xxxl"`). It is possible to set the parameter value to raw strings such as `"lg"`, `"md"`, or `"sm"`. However, the recommended practice is to use the properties of the static [`ThemeConstants.SvgIcon.Size` class](/blazor-ui/api/telerik.blazor.themeconstants.svgicon.size). |
| `Size` | `string` <br /> (`"md"`) | Any of the predefined icon sizes (from `"xs"` to `"xxxl"`). It is possible to set the parameter value to raw strings such as `"lg"`, `"md"`, or `"sm"`. However, the recommended practice is to use the properties of the static [`ThemeConstants.SvgIcon.Size` class](slug://telerik.blazor.themeconstants.svgicon.size). |
| `ChildContent` | `RenderFragment` | The HTML markup of a custom SVG icon. Do not use together with `Icon`. |
| `ThemeColor` | `string` | Any of the predefined icon colors. Use the static [`ThemeConstants.SvgIcon.ThemeColor` class](/blazor-ui/api/telerik.blazor.themeconstants.svgicon.themecolor) properties. |
| `ThemeColor` | `string` | Any of the predefined icon colors. Use the static [`ThemeConstants.SvgIcon.ThemeColor` class](slug://telerik.blazor.themeconstants.svgicon.themecolor) properties. |

>caption Using TelerikSvgIcon

Expand Down Expand Up @@ -294,7 +294,7 @@ The `ISvgIcon` interface members are:
It is possible to configure the icon type for the whole application:

1. Locate the [`<TelerikRootComponent>`](slug://rootcomponent-overview) tag in the Blazor app. Normally, it's in a layout file such as `MainLayout.razor` or `TelerikLayout.razor`.
2. Set the RootComponent `IconType` parameter to an [`IconType` enum](/blazor-ui/api/telerik.blazor.icontype) value (`Svg` or `Font`). The default icon type is `Svg`.
2. Set the RootComponent `IconType` parameter to an [`IconType` enum](slug://telerik.blazor.icontype) value (`Svg` or `Font`). The default icon type is `Svg`.

>caption Define global icon type via TelerikRootComponent

Expand Down
Loading
Loading