Skip to content

Commit 70a3ca5

Browse files
chore(kb): link sample projects from KBs
1 parent 659968e commit 70a3ca5

9 files changed

+200
-0
lines changed

knowledge-base/chart-responsive.md

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
---
2+
title: Responsive Chart
3+
description: How to adjust the size of a chart when its container or the browser window size changes
4+
type: how-to
5+
page_title: How to make a responsive chart
6+
slug: chart-kb-responsive
7+
position:
8+
tags:
9+
res_type: kb
10+
---
11+
12+
## Environment
13+
<table>
14+
<tbody>
15+
<tr>
16+
<td>Product</td>
17+
<td>Charts for Blazor</td>
18+
</tr>
19+
</tbody>
20+
</table>
21+
22+
23+
## Description
24+
25+
When the user resizes the browser window or some layout change happens (for example, a navigation panel is expanded or collapsed), you may want to have the charts redraw with the new dimensions.
26+
27+
## Solution
28+
29+
Generally, the `Width` and `Height` parameters of the chart can take values in `%`, and the chart will render according to the dimensions of its parent element.
30+
31+
This works well for the initial rendering and the chart will be "responsive" immediately according to your layout, regardless of the display (desktop, tablet, phone).
32+
33+
When the layout changes dynamically at runtime, you have to call its `.Refresh()` method. You can find an example in the following sample project: [https://github.com/telerik/blazor-ui/tree/master/chart/responsive-chart](https://github.com/telerik/blazor-ui/tree/master/chart/responsive-chart)
Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
---
2+
title: Confirm Button Click and Create a Message Box
3+
description: How to confirm the click of a button and to create a message box
4+
type: how-to
5+
page_title: How to confirm button click and create a message box
6+
slug: common-kb-confirm-button-messagebox
7+
position:
8+
tags:
9+
res_type: kb
10+
---
11+
12+
13+
## Description
14+
15+
Sometimes user actions can be sensitive or result in data deletion. For such cases, you may want to require confirmation to protect against accidental clicks.
16+
17+
18+
## Solution
19+
20+
Until [confirm dialogs](https://feedback.telerik.com/blazor/1433023-predefined-windows) are implemented, you can review the following examples:
21+
22+
* [https://github.com/telerik/blazor-ui/tree/master/common/confirm-button](https://github.com/telerik/blazor-ui/tree/master/common/confirm-button)
23+
* [https://github.com/telerik/blazor-ui/tree/master/common/message-box](https://github.com/telerik/blazor-ui/tree/master/common/message-box)

knowledge-base/grid-batch-edit.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
---
2+
title: Batch Editing in the Grid
3+
description: How to implement batch editing in the grid
4+
type: how-to
5+
page_title: Grid Batch Edit
6+
slug: grid-kb-batch-edit
7+
position:
8+
tags:
9+
res_type: kb
10+
---
11+
12+
13+
## Description
14+
15+
How to edit several records in the grid at once and to only create one request to the database/service to save the changes? How to implement batch editing?
16+
17+
18+
## Solution
19+
20+
An example is available in the following project: [https://github.com/telerik/blazor-ui/tree/master/grid/batch-editing](https://github.com/telerik/blazor-ui/tree/master/grid/batch-editing)
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
---
2+
title: Custom Edit Form in the grid
3+
description: How to implement a custom edit form in the grid
4+
type: how-to
5+
page_title: Grid Custom Edit Form
6+
slug: grid-kb-custom-edit-form
7+
position:
8+
tags:
9+
res_type: kb
10+
---
11+
12+
13+
## Description
14+
15+
How to customize the editing experience? How to change the layout of the popup editing form? How to implement business logic around the editing form?
16+
17+
18+
## Solution
19+
20+
An example is available in the following project: [https://github.com/telerik/blazor-ui/tree/master/grid/custom-popup-form](https://github.com/telerik/blazor-ui/tree/master/grid/custom-popup-form)
21+
22+
The following demo also shows one approach: [https://demos.telerik.com/blazor-ui/grid/editing-custom-form](https://demos.telerik.com/blazor-ui/grid/editing-custom-form)

knowledge-base/grid-grpc.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
---
2+
title: Consume gRPC services in Blazor
3+
description: How to Consume gRPC services in Blazor
4+
type: how-to
5+
page_title: Consume gRPC services in Blazor
6+
slug: common-kb-grpc
7+
position:
8+
tags:
9+
res_type: kb
10+
---
11+
12+
13+
## Description
14+
15+
gRPC services are becoming more common in various applications and you may want to benefit from them in your Blazor applications as well.
16+
17+
18+
## Solution
19+
20+
The gRPC tooling is compatible with .NET Core and can, therefore, work in Blazor applications. You can find an example of creating a gRPC service and using it to inject models into the Blazor app, then showing data from the service in a grid in the following project: [https://github.com/telerik/blazor-ui/tree/master/common/grpc-example](https://github.com/telerik/blazor-ui/tree/master/common/grpc-example)

knowledge-base/grid-odata.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
---
2+
title: Consume ODATA services in the grid
3+
description: How to ConsumeODATA services in the grid
4+
type: how-to
5+
page_title: Consume ODATA services in the grid
6+
slug: common-kb-odata
7+
position:
8+
tags:
9+
res_type: kb
10+
---
11+
12+
13+
## Description
14+
15+
How to use the grid with an ODATA service? How do I get parameters such as filtering and sorting to pass to the service so it can return the appropriate data?
16+
17+
18+
## Solution
19+
20+
An example is available in the following project: [https://github.com/telerik/blazor-ui/tree/master/grid/odata](https://github.com/telerik/blazor-ui/tree/master/grid/odata)
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
---
2+
title: Persist Grid Selection Across Pages
3+
description: How to Persist Grid Selection Across Pages
4+
type: how-to
5+
page_title: Persist Grid Selection Across Pages
6+
slug: common-kb-persist-selection-across-pages
7+
position:
8+
tags:
9+
res_type: kb
10+
---
11+
12+
13+
## Description
14+
15+
How do I select data across different pages without losing the current selection? If I click a row, all other rows are unselected. If I click the header checkbox, only the current page is selected.
16+
17+
18+
## Solution
19+
20+
If your users don't use the `Ctrl` and/or `Shift` buttons to extend the selection, you may want to implement some logic that amends the current selection. This also extends to the Select All checkbox in the header.
21+
22+
An example is available in the following project: [https://github.com/telerik/blazor-ui/tree/master/grid/persist-selection](https://github.com/telerik/blazor-ui/tree/master/grid/persist-selection)

knowledge-base/grid-print.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
---
2+
title: Print the Grid
3+
description: How to Print the Grid
4+
type: how-to
5+
page_title: Print the Grid
6+
slug: grid-kb-print
7+
position:
8+
tags:
9+
res_type: kb
10+
---
11+
12+
13+
## Description
14+
15+
How do I print the grid?
16+
17+
18+
## Solution
19+
20+
An example is available in the following project: [https://github.com/telerik/blazor-ui/tree/master/grid/print](https://github.com/telerik/blazor-ui/tree/master/grid/print)
Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
---
2+
title: Scheduler Custom Edit Form
3+
description: How to create a Scheduler Custom Edit Form
4+
type: how-to
5+
page_title: Scheduler Custom Edit Form
6+
slug: scheduler-kb-custom-edit-form
7+
position:
8+
tags:
9+
res_type: kb
10+
---
11+
12+
13+
## Description
14+
15+
The built-in edit form of the scheduler lets you edit all aspects of the appointments. In some cases, however, you may want to have some more metadata, or to implement certain business logic there. In such cases, you must create a custom edit form through the scheduler's `OnEdit` event.
16+
17+
18+
## Solution
19+
20+
An example is available in the following project: [https://github.com/telerik/blazor-ui/tree/master/scheduler/custom-edit-form](https://github.com/telerik/blazor-ui/tree/master/scheduler/custom-edit-form)

0 commit comments

Comments
 (0)