Merge pull request #3555 from IgniteUI/dpetev/filter-sample-input-clear

IgniteUI · Nov 5, 2024 · bc3c431 · bc3c431
2 parents be36b49 + d908d8e
commit bc3c431
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 4 deletions.
diff --git a/projects/app-lob/src/app/grid/grid-boston-marathon/grid.component.ts b/projects/app-lob/src/app/grid/grid-boston-marathon/grid.component.ts
@@ -197,8 +197,12 @@ export class GridComponent implements OnInit, OnDestroy, AfterViewInit {
     }
 
     public filter(target: EventTarget): void {
-        this.grid1.filter('CountryName', (target as HTMLInputElement).value, IgxStringFilteringOperand.instance().condition('contains'), true);
-        this.grid1.markForCheck();
+        const value = (target as HTMLInputElement).value;
+        if (value) {
+            this.grid1.filter('CountryName', value, IgxStringFilteringOperand.instance().condition('contains'));
+        } else {
+            this.grid1.clearFilter('CountryName');
+        }
     }
 
     public showAlert(element: ElementRef): void {

diff --git a/src/app/grid/grid-filtering-sample/grid-filtering-sample.component.ts b/src/app/grid/grid-filtering-sample/grid-filtering-sample.component.ts
@@ -21,7 +21,12 @@ export class FilteringSampleComponent implements OnInit {
     }
 
     public filter(target: EventTarget) {
-        this.grid1.filter('ProductName', (target as HTMLInputElement).value, IgxStringFilteringOperand.instance().condition('contains'));
+        const value = (target as HTMLInputElement).value;
+        if (value) {
+            this.grid1.filter('ProductName', value, IgxStringFilteringOperand.instance().condition('contains'));
+        } else {
+            this.grid1.clearFilter('ProductName');
+        }
     }
 
     public formatDate(val: Date) {

diff --git a/src/app/tree-grid/tree-grid-filtering-sample/tree-grid-filtering-sample.component.ts b/src/app/tree-grid/tree-grid-filtering-sample/tree-grid-filtering-sample.component.ts
@@ -27,7 +27,12 @@ export class TreeGridFilteringSampleComponent implements OnInit {
     }
 
     public filter(element: EventTarget) {
-        this.treegrid1.filter('Name', (element as HTMLInputElement).value, IgxStringFilteringOperand.instance().condition('contains'));
+        const value = (element as HTMLInputElement).value;
+        if (value) {
+            this.treegrid1.filter('Name', value, IgxStringFilteringOperand.instance().condition('contains'));
+        } else {
+            this.treegrid1.clearFilter('Name');
+        }
     }
 
     public formatDate(val: Date) {