diff --git a/src/app/grid/grid-sample-pinning-both-sides/grid-toolbar-pinning-both-sides.component.ts b/src/app/grid/grid-sample-pinning-both-sides/grid-toolbar-pinning-both-sides.component.ts
index 0cf523dd1..92b91a45f 100644
--- a/src/app/grid/grid-sample-pinning-both-sides/grid-toolbar-pinning-both-sides.component.ts
+++ b/src/app/grid/grid-sample-pinning-both-sides/grid-toolbar-pinning-both-sides.component.ts
@@ -54,12 +54,14 @@ export class GridBothSideToolbarPinningSampleComponent implements OnInit {
 
     public pinLeft() {
         this.grid1.selectedColumns().forEach((col: IgxColumnComponent) => {
+            col.pinned = false;
             col.pinningPosition = ColumnPinningPosition.Start;
             col.pinned = true;
         });
     }
     public pinRight() {
         this.grid1.selectedColumns().forEach((col: IgxColumnComponent) => {
+            col.pinned = false;
             col.pinningPosition = ColumnPinningPosition.End;
             col.pinned = true;
         });
diff --git a/src/app/hierarchical-grid/hierarchical-grid-sample-both-sides-pinning/hierarchical-grid-both-sides-pinning.component.ts b/src/app/hierarchical-grid/hierarchical-grid-sample-both-sides-pinning/hierarchical-grid-both-sides-pinning.component.ts
index 3fc88fd61..403c2265f 100644
--- a/src/app/hierarchical-grid/hierarchical-grid-sample-both-sides-pinning/hierarchical-grid-both-sides-pinning.component.ts
+++ b/src/app/hierarchical-grid/hierarchical-grid-sample-both-sides-pinning/hierarchical-grid-both-sides-pinning.component.ts
@@ -82,6 +82,7 @@ export class HierarchicalGridBothSidePinningSampleComponent implements OnInit {
 
     public pinLeft() {
         this.grid1.selectedColumns().forEach((col: IgxColumnComponent) => {
+            col.pinned = false;
             col.pinningPosition = ColumnPinningPosition.Start;
             col.pinned = true;
         });
@@ -89,6 +90,7 @@ export class HierarchicalGridBothSidePinningSampleComponent implements OnInit {
 
     public pinRight() {
         this.grid1.selectedColumns().forEach((col: IgxColumnComponent) => {
+            col.pinned = false;
             col.pinningPosition = ColumnPinningPosition.End;
             col.pinned = true;
         });
diff --git a/src/app/tree-grid/tree-grid-sample-both-pinning/tree-grid-both-sides-pinning.component.ts b/src/app/tree-grid/tree-grid-sample-both-pinning/tree-grid-both-sides-pinning.component.ts
index 3aa89d085..b2884df23 100644
--- a/src/app/tree-grid/tree-grid-sample-both-pinning/tree-grid-both-sides-pinning.component.ts
+++ b/src/app/tree-grid/tree-grid-sample-both-pinning/tree-grid-both-sides-pinning.component.ts
@@ -43,6 +43,7 @@ export class TreeGridBothSidesPinningSampleComponent implements OnInit {
 
     public pinLeft() {
         this.grid1.selectedColumns().forEach((col: IgxColumnComponent) => {
+            col.pinned = false;
             col.pinningPosition = ColumnPinningPosition.Start;
             col.pinned = true;
         });
@@ -50,6 +51,7 @@ export class TreeGridBothSidesPinningSampleComponent implements OnInit {
 
     public pinRight() {
         this.grid1.selectedColumns().forEach((col: IgxColumnComponent) => {
+            col.pinned = false;
             col.pinningPosition = ColumnPinningPosition.End;
             col.pinned = true;
         });