Skip to content

Commit f9d0cb3

Browse files
Merge pull request #812 from Syncfusion-Content/hotfix/hotfix-v29.1.33
DOCINFRA-2341_merged_using_automation
2 parents e563018 + 0ba5fc5 commit f9d0cb3

File tree

4 files changed

+30
-29
lines changed

4 files changed

+30
-29
lines changed

ej2-angular/grid/columns/frozen-column.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -126,7 +126,7 @@ The following example demonstrates how to change the default frozen line color u
126126

127127
{% previewsample "page.domainurl/samples/grid/frozencolumns-cs4" %}
128128

129-
## Render DatePicker in frozen columns in Angular Grid
129+
## Render DatePicker in frozen columns in Grid
130130

131131
The Syncfusion Angular Grid allows rendering a [DatePicker](https://ej2.syncfusion.com/angular/demos/#/bootstrap5/datepicker/default) inside frozen columns during editing. This is achieved using the [edit](https://ej2.syncfusion.com/angular/documentation/api/grid/column/#edit) property, where a custom editor (DatePicker) is assigned to the specific column.
132132

ej2-angular/grid/editing/edit.md

Lines changed: 0 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -266,32 +266,6 @@ In the following code example, the Employee Name is a foreign key column. When e
266266

267267
{% previewsample "page.domainurl/samples/grid/edit-tempalte" %}
268268

269-
## Prevent adding duplicate rows in Syncfusion Angular Grid with custom validation
270-
271-
The Syncfusion Angular Grid allows you to enforce constraints to prevent duplicate rows by customizing the validation logic within the Grid setup. This ensures data integrity by restricting duplicate entries in the **OrderID** column.
272-
273-
To prevent adding duplicate rows in the Grid, follow these steps:
274-
275-
1. Implement Custom Validation: Define the `orderIdCustomValidation` function to check whether the entered **OrderID** already exists in the [dataSource](https://ej2.syncfusion.com/angular/documentation/api/grid/#datasource). This allows editing an existing row without triggering a duplicate error.
276-
277-
2. Add Dynamic Validation Rules: Create the `orderIDRules` object to enforce unique **OrderID** values. Dynamically add this rule to the form during the **save** action.
278-
279-
3. Handle Validation in the [actionBegin](https://ej2.syncfusion.com/angular/documentation/api/grid/#actionbegin) event: In the `actionBegin` event, check if the **requestType** is **save**. Apply the validation rule before saving and cancel the action `args.cancel = true` if the validation fails.
280-
281-
For server-side validation to prevent adding duplicate rows, you can refer to the detailed guidance provided in our [knowledge base](https://support.syncfusion.com/kb/article/11608/how-to-do-server-side-validation-for-grid-in-asp-net-mvc-application). If you want to display the Grid's validation tooltip instead of the alert used in our knowledge base, you can call the `grid.editModule.formObj.validate()` method in the `Ajax/Fetch` success function to display the Grid's tooltip validation for the server side.
282-
283-
{% tabs %}
284-
{% highlight ts tabtitle="app.component.ts" %}
285-
{% include code-snippet/grid/edit-cs55/src/app.component.ts %}
286-
{% endhighlight %}
287-
288-
{% highlight ts tabtitle="main.ts" %}
289-
{% include code-snippet/grid/edit-cs55/src/main.ts %}
290-
{% endhighlight %}
291-
{% endtabs %}
292-
293-
{% previewsample "page.domainurl/samples/grid/edit-cs55" %}
294-
295269
## How to perform CRUD action externally
296270

297271
Performing CRUD (Create, Read, Update, Delete) actions externally in the Syncfusion<sup style="font-size:70%">&reg;</sup> Grid allows you to manipulate grid data outside the grid itself. This can be useful in scenarios where you want to manage data operations programmatically.

ej2-angular/grid/editing/validation.md

Lines changed: 27 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -387,4 +387,30 @@ namespace UrlAdaptor.Server.Models
387387

388388
The following screenshot illustrates how to retrieve and display error messages when CRUD operations fail:
389389

390-
![custom error message](../../grid/images/custom-error-message.png)
390+
![custom error message](../../grid/images/custom-error-message.png)
391+
392+
## Prevent adding duplicate rows with custom validation
393+
394+
The Syncfusion Angular Grid allows you to enforce constraints to prevent duplicate rows by customizing the validation logic within the Grid setup. This ensures data integrity by restricting duplicate entries in the **OrderID** column.
395+
396+
To prevent adding duplicate rows in the Grid, follow these steps:
397+
398+
1. Implement Custom Validation: Define the `orderIdCustomValidation` function to check whether the entered **OrderID** already exists in the [dataSource](https://ej2.syncfusion.com/angular/documentation/api/grid/#datasource). This allows editing an existing row without triggering a duplicate error.
399+
400+
2. Add Dynamic Validation Rules: Create the `orderIDRules` object to enforce unique **OrderID** values. Dynamically add this rule to the form during the **save** action.
401+
402+
3. Handle Validation in the [actionBegin](https://ej2.syncfusion.com/angular/documentation/api/grid/#actionbegin) event: In the `actionBegin` event, check if the **requestType** is **save**. Apply the validation rule before saving and cancel the action `args.cancel = true` if the validation fails.
403+
404+
For server-side validation to prevent adding duplicate rows, you can refer to the detailed guidance provided in our [knowledge base](https://support.syncfusion.com/kb/article/11608/how-to-do-server-side-validation-for-grid-in-asp-net-mvc-application). If you want to display the Grid's validation tooltip instead of the alert used in our knowledge base, you can call the `grid.editModule.formObj.validate()` method in the `Ajax/Fetch` success function to display the Grid's tooltip validation for the server side.
405+
406+
{% tabs %}
407+
{% highlight ts tabtitle="app.component.ts" %}
408+
{% include code-snippet/grid/edit-cs55/src/app.component.ts %}
409+
{% endhighlight %}
410+
411+
{% highlight ts tabtitle="main.ts" %}
412+
{% include code-snippet/grid/edit-cs55/src/main.ts %}
413+
{% endhighlight %}
414+
{% endtabs %}
415+
416+
{% previewsample "page.domainurl/samples/grid/edit-cs55" %}

ej2-angular/ui-kit/overview.md

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ domainurl: ##DomainURL##
1010

1111
# Overview: Essential<sup style="font-size:70%">&reg;</sup> UI Kit for Angular
1212

13-
The Essential<sup style="font-size:70%">&reg;</sup> UI Kit for Angular comprises over 160 responsive, ready-to-use, easy-to-implement, and customizable blocks designed to help you quickly build web applications. These blocks are developed using HTML, CSS, TypeScript, and Syncfusion<sup style="font-size:70%">&reg;</sup> Angular components, delivering robust functionality and ease of use. They are compatible with both Tailwind CSS and Bootstrap 5.3 CSS frameworks, supporting light and dark modes to offer flexibility and seamless integration across different user preferences. The UI kit includes blocks for the following categories:
13+
The Essential<sup style="font-size:70%">&reg;</sup> UI Kit for Angular comprises over 175 responsive, ready-to-use, easy-to-implement, and customizable blocks designed to help you quickly build web applications. These blocks are developed using HTML, CSS, TypeScript, and Syncfusion<sup style="font-size:70%">&reg;</sup> Angular components, delivering robust functionality and ease of use. They are compatible with both Tailwind CSS and Bootstrap 5.3 CSS frameworks, supporting light and dark modes to offer flexibility and seamless integration across different user preferences. The UI kit includes blocks for the following categories:
1414

1515
<table>
1616
<tr>
@@ -50,6 +50,7 @@ The Essential<sup style="font-size:70%">&reg;</sup> UI Kit for Angular comprises
5050
<li>Calendar</li>
5151
<li>Pagination</li>
5252
<li>Footer</li>
53+
<li>Notification</li>
5354
</ul>
5455
</td>
5556
</tr>

0 commit comments

Comments
 (0)