From e8fec5575c0217bbe4ce5bb68972ecfe3845460a Mon Sep 17 00:00:00 2001
From: Sena Sowseelya <sena.sowshelya@us.gt.com>
Date: Fri, 28 Jul 2023 14:17:54 +0530
Subject: [PATCH] Fix for incorrect behaviour when a column is both sortable
 and filterable

---
 src/app/components/table/table.ts | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/src/app/components/table/table.ts b/src/app/components/table/table.ts
index 0d7a3afd456..5eeeec1bc28 100644
--- a/src/app/components/table/table.ts
+++ b/src/app/components/table/table.ts
@@ -3325,7 +3325,7 @@ export class SortableColumn implements OnInit, OnDestroy {
 
     @HostListener('click', ['$event'])
     onClick(event: MouseEvent) {
-        if (this.isEnabled() && !this.isFilterElement(<HTMLElement>event.target)) {
+        if (this.isEnabled()) {
             this.updateSortState();
             this.dt.sort({
                 originalEvent: event,
@@ -3345,10 +3345,6 @@ export class SortableColumn implements OnInit, OnDestroy {
         return this.pSortableColumnDisabled !== true;
     }
 
-    isFilterElement(element: HTMLElement) {
-        return DomHandler.hasClass(element, 'pi-filter-icon') || DomHandler.hasClass(element, 'p-column-filter-menu-button');
-    }
-
     ngOnDestroy() {
         if (this.subscription) {
             this.subscription.unsubscribe();
@@ -4768,7 +4764,7 @@ export class ReorderableRow implements AfterViewInit {
                 aria-haspopup="true"
                 [attr.aria-expanded]="overlayVisible"
                 [ngClass]="{ 'p-column-filter-menu-button-open': overlayVisible, 'p-column-filter-menu-button-active': hasFilter() }"
-                (click)="toggleMenu()"
+                (click)="toggleMenu($event)"
                 (keydown)="onToggleButtonKeyDown($event)"
             >
                 <FilterIcon [styleClass]="'pi-filter-icon'" *ngIf="!filterIconTemplate" />
@@ -5099,8 +5095,9 @@ export class ColumnFilter implements AfterContentInit {
         }
     }
 
-    toggleMenu() {
+    toggleMenu(event : any) {
         this.overlayVisible = !this.overlayVisible;
+        event.stopPropagation();
     }
 
     onToggleButtonKeyDown(event: KeyboardEvent) {