diff --git a/src/app/components/table/table.ts b/src/app/components/table/table.ts
index b80799fe23d..1163481f324 100644
--- a/src/app/components/table/table.ts
+++ b/src/app/components/table/table.ts
@@ -5133,7 +5133,7 @@ export class ReorderableRow implements AfterViewInit {
                 [ngClass]="{ 'p-column-filter-overlay p-component p-fluid': true, 'p-column-filter-overlay-menu': display === 'menu' }"
                 [id]="overlayId"
                 [attr.aria-modal]="true"
-                role="filterDialog"
+                role="dialog"
                 (click)="onContentClick()"
                 [@overlayAnimation]="'visible'"
                 (@overlayAnimation.start)="onOverlayAnimationStart($event)"
@@ -5788,9 +5788,10 @@ export class ColumnFilter implements AfterContentInit {
             const documentTarget: any = this.el ? this.el.nativeElement.ownerDocument : 'document';
 
             this.documentClickListener = this.renderer.listen(documentTarget, 'mousedown', (event) => {
-                const dialogElements = document.querySelectorAll('[role="filterDialog"]');
+                let isDateDialog = false;
+                document.querySelectorAll('[role="dialog"]').forEach(d => { if(DomHandler.hasClass(d, 'p-datepicker')) isDateDialog = true; });
                 const targetIsColumnFilterMenuButton = event.target.closest('.p-column-filter-menu-button');
-                if (this.overlayVisible && this.isOutsideClicked(event) && (targetIsColumnFilterMenuButton || dialogElements?.length <= 1)) {
+                if (this.overlayVisible && this.isOutsideClicked(event) && (targetIsColumnFilterMenuButton || !isDateDialog)) {
                     this.hide();
                 }