You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: components/gantt/gantt-tree/editing/popup.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -23,7 +23,7 @@ In a similar fashion, the `Cancel`, `Delete` command buttons and the `Add` toolb
23
23
24
24
You can also cancel the events by setting the `IsCancelled` property of the event arguments to `true`. This lets you prevent the user from editing certain records, inserting or deleting items, based on your application logic.
25
25
26
-
To enable PopUp editing in the Gantt Tree, set its `TreeListEditMode` property to `GanttTreeListEditMode.Popup`, then handle the CRUD events as shown in the example below.
26
+
To enable Popup editing in the Gantt Tree, set its `TreeListEditMode` property to `GanttTreeListEditMode.Popup`, then handle the CRUD events as shown in the example below.
27
27
28
28
29
29
>caption The Command buttons and the Gantt events let you handle data operations in Popup edit mode.
Copy file name to clipboardExpand all lines: components/grid/editing/incell.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -196,7 +196,7 @@ Click a cell, edit it and click outside of the grid to see the change. You can a
196
196
197
197
* The `OnCreate` event will fire as soon as you click the `Add` button. The Grid will render the new row and enter edit mode for the first editable column (to fire `OnEdit` and let the user alter the column). This means you should have [default values]({%slug grid-kb-default-value-for-new-row%}) that satisfy any initial validation and requirements your models may have.
198
198
199
-
* This means that there is no actual inserted item, an item in InCell editing is always in Edit mode, never in Insert mode. Thus, you cannot use the `InsertedItem` field of the Grid [State]({%slug grid-state%}). If you want to insert items programmatically in the Grid, alter the `Data` collection, and use the `OriginalEditItem` feature of the state (see the [Initiate Editing or Inserting of an Item]({%slug grid-state%}#initiate-editing-or-inserting-of-an-item) example - it can put the InLine and PopUp edit modes in Insert mode, but this cannot work for InCell editing).
199
+
* This means that there is no actual inserted item, an item in InCell editing is always in Edit mode, never in Insert mode. Thus, you cannot use the `InsertedItem` field of the Grid [State]({%slug grid-state%}). If you want to insert items programmatically in the Grid, alter the `Data` collection, and use the `OriginalEditItem` feature of the state (see the [Initiate Editing or Inserting of an Item]({%slug grid-state%}#initiate-editing-or-inserting-of-an-item) example - it can put the InLine and Popup edit modes in Insert mode, but this cannot work for InCell editing).
200
200
201
201
* The `OnEdit` event fires every time a cell is opened for editing. Until version **2.27**, the event fired **once per row** - when the user edits a cell from a different row.
@@ -23,12 +27,12 @@ In a similar fashion, the `Cancel`, `Delete` command buttons and the `Add` toolb
23
27
24
28
You can also cancel the events by setting the `IsCancelled` property of the event arguments to `true`. This lets you prevent the user from editing certain records, inserting or deleting items, based on your application logic.
25
29
26
-
To enable PopUp editing in the grid, set its `EditMode` property to `Telerik.Blazor.GridEditMode.Popup`, then handle the CRUD events as shown in the example below.
30
+
To enable Popup editing in the grid, set its `EditMode` property to `Telerik.Blazor.GridEditMode.Popup`, then handle the CRUD events as shown in the example below.
27
31
28
-
The PopUp editing mode supports [validation]({%slug common-features/input-validation%}). To use it, all you need to do is decorate your model with the desired annotations. Validation errors will be shown in the popup and will prevent the Update operation.
32
+
The Popup editing mode supports [validation]({%slug common-features/input-validation%}). To use it, all you need to do is decorate your model with the desired annotations. Validation errors will be shown in the popup and will prevent the Update operation.
29
33
30
34
31
-
>caption The Command buttons and the grid events let you handle data operations in PopUp edit mode (see the code comments for details)
35
+
>caption The Command buttons and the grid events let you handle data operations in Popup edit mode (see the code comments for details)
32
36
33
37
````CSHTML
34
38
@using System.ComponentModel.DataAnnotations
@@ -260,9 +264,17 @@ The `GridPopupEditFormSettings` nested tag exposes the following parameters to a
260
264
}
261
265
````
262
266
267
+
### Popup Form Customization
268
+
269
+
In the `GridPopupEditFormSettings`, you can declare a `FormTemplate`. This template enables you to fully customize the appearance and content of the create/edit Popup window in the Grid. For more information and examples on customizing the Grid Popup window, refer to the [Popup Form Template]({%slug grid-templates-popup-form%}) article.
270
+
271
+
### Popup Buttons Customization
272
+
273
+
You can specify a `ButtonsTemplate` in the `GridPopupEditFormSettings` to customize how the buttons look in the create/edit Popup window of the Grid. To learn more and see an example of customizing the Grid Popup buttons, refer to the [Popup Buttons Template]({%slug grid-templates-popup-buttons%}) article.
Copy file name to clipboardExpand all lines: components/grid/selection/overview.md
+2-2Lines changed: 2 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -144,9 +144,9 @@ In the [Incell EditMode]({%slug components/grid/editing/incell%}) selection can
144
144
145
145
To see how to select the row that is being edited in InCell edit mode without using a `<GridCheckboxColumn />` check out the [Row Selection in Edit with InCell EditMode]({%slug grid-kb-row-select-incell-edit%}) Knowledge Base article.
146
146
147
-
#### Inline and PopUp Edit Modes
147
+
#### Inline and Popup Edit Modes
148
148
149
-
In [Inline EditMode]({%slug components/grid/editing/inline%}) and [PopUp EditMode]({%slug components/grid/editing/popup%}) selection can be done by clicking on the desired row or by using a `<GridCheckboxColumn />`.
149
+
In [Inline EditMode]({%slug components/grid/editing/inline%}) and [Popup EditMode]({%slug components/grid/editing/popup%}) selection can be done by clicking on the desired row or by using a `<GridCheckboxColumn />`.
Copy file name to clipboardExpand all lines: components/grid/sizing.md
+1-1Lines changed: 1 addition & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -54,7 +54,7 @@ You can increase or decrease the size of the Grid by setting the `Size` attribut
54
54
55
55
## Notes
56
56
57
-
1. The `Size` option does not affect elements displayed inside a PopUp (such as [Filter Menu]({%slug grid-filter-menu%}), [Column Menu]({%slug grid-column-menu%}), etc.). By design, all PopUp elements are rendered on root level, so they are not technically inside the Grid. Thus, the `Size` option cannot propagate to them. Тo change the `Size` options of the elements inside PopUps, you can use a template(where available), so you can override the built-in rendering. You can then add custom elements and explicitly specify their `Size`.
57
+
1. The `Size` option does not affect elements displayed inside a Popup (such as [Filter Menu]({%slug grid-filter-menu%}), [Column Menu]({%slug grid-column-menu%}), etc.). By design, all Popup elements are rendered on root level, so they are not technically inside the Grid. Thus, the `Size` option cannot propagate to them. Тo change the `Size` options of the elements inside Popups, you can use a template(where available), so you can override the built-in rendering. You can then add custom elements and explicitly specify their `Size`.
58
58
59
59
1. The `Size` option does not propagate to components rendered inside templates (this includes elements in [GridToolBar]({%slug components/grid/features/toolbar%}), [CommandColumn]({%slug components/grid/columns/command%}), etc.). To change the size of the elements in those components you have to set it explicitly.
Copy file name to clipboardExpand all lines: components/grid/templates/popup-form-template.md
+5-1Lines changed: 5 additions & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -11,7 +11,11 @@ position: 50
11
11
12
12
# Popup Form Template
13
13
14
-
With the `FormTemplate` feature, you can customize the appearance and content of the create/edit Popup window of the Grid.
14
+
With the `FormTemplate` feature, you can customize the appearance and content of the create/edit Popup window of the Grid. Declare the desired custom content inside the `<FormTemplate>` inner tag of the `<GridPopupEditFormSettings>`.
15
+
16
+
You can use the `Context` attribute of the `<FormTemplate>` tag to set the name of the context variable. The context variable is of type `object` and can be cast to the model type to which the Grid is bound.
17
+
18
+
>When using the template, the default Popup form is replaced by the declared content within the `FormTemplate` tag. Consequently, the default `Update` and `Cancel` buttons are removed. This means the [`OnUpdate` and `OnCancel`](https://docs.telerik.com/blazor-ui/components/grid/events#cud-events) events cannot be triggered. To modify or cancel the update of a record, you need to include custom controls to manage these actions.
15
19
16
20
>caption Using a `FormTemplate` to modify the Edit/Create Popup window.
0 commit comments