diff --git a/playbook/app/pb_kits/playbook/pb_advanced_table/index.js b/playbook/app/pb_kits/playbook/pb_advanced_table/index.js
index fa6e2523bf..ec9c1a71b5 100644
--- a/playbook/app/pb_kits/playbook/pb_advanced_table/index.js
+++ b/playbook/app/pb_kits/playbook/pb_advanced_table/index.js
@@ -13,9 +13,20 @@ export default class PbAdvancedTable extends PbEnhancedElement {
   get target() {
     return document.querySelector(CONTENT_SELECTOR.replace("id", this.element.id))
   }
+  
+  static expandedRows = new Set()
+  static isCollapsing = false
 
   connect() {
     this.element.addEventListener('click', () => {
+      if (!PbAdvancedTable.isCollapsing) {
+        const isExpanded = this.element.querySelector(UP_ARROW_SELECTOR).style.display === 'inline-block'
+        if (!isExpanded) {
+          PbAdvancedTable.expandedRows.add(this.element.id)
+        } else {
+          PbAdvancedTable.expandedRows.delete(this.element.id)
+        }
+      }
       this.toggleElement(this.target)
     })
   }
@@ -75,4 +86,53 @@ export default class PbAdvancedTable extends PbEnhancedElement {
     this.element.querySelector(UP_ARROW_SELECTOR).style.display = 'inline-block'
     this.element.querySelector(DOWN_ARROW_SELECTOR).style.display = 'none'
   }
+
+  static handleToggleAllHeaders(element) {
+    const table = element.closest('.pb_table')
+    const firstLevelButtons = table.querySelectorAll('.pb_advanced_table_body > .pb_table_tr [data-advanced-table]')
+    
+    const expandedRows = Array.from(firstLevelButtons).filter(button => 
+      button.querySelector(UP_ARROW_SELECTOR).style.display === 'inline-block'
+    )
+  
+    if (expandedRows.length === firstLevelButtons.length) {
+      expandedRows.forEach(button => {
+        button.click()
+      })
+      this.expandedRows.clear()
+    } else {
+      firstLevelButtons.forEach(button => {
+        if (!this.expandedRows.has(button.id)) {
+          button.click()
+        }
+      })
+    }
+  }
+  static handleToggleAllSubRows(element, rowDepth) {
+    const parentElement = element.closest(".toggle-content")
+    const subrowButtons = parentElement.querySelectorAll('.depth-sub-row-' + rowDepth + ' [data-advanced-table]')
+    
+    const expandedSubRows = Array.from(subrowButtons).filter(button => 
+      button.querySelector(UP_ARROW_SELECTOR).style.display === 'inline-block'
+    )
+  
+    if (expandedSubRows.length === subrowButtons.length) {
+      expandedSubRows.forEach(button => {
+        button.click()
+      })
+    } else {
+      subrowButtons.forEach(button => {
+        if (!this.expandedRows.has(button.id)) {
+          button.click()
+        }
+      })
+    }
+  }
+}
+
+window.expandAllRows = (element) => {
+  PbAdvancedTable.handleToggleAllHeaders(element)
 }
+window.expandAllSubRows = (element, rowDepth) => {
+  PbAdvancedTable.handleToggleAllSubRows(element, rowDepth)
+}
\ No newline at end of file
diff --git a/playbook/app/pb_kits/playbook/pb_advanced_table/table_header.html.erb b/playbook/app/pb_kits/playbook/pb_advanced_table/table_header.html.erb
index f98b8bfda3..fa857e1926 100644
--- a/playbook/app/pb_kits/playbook/pb_advanced_table/table_header.html.erb
+++ b/playbook/app/pb_kits/playbook/pb_advanced_table/table_header.html.erb
@@ -13,12 +13,4 @@
                 <% end %>
             <% end %>
         <% end %>
-<% end %>
-
-<script type="text/javascript">
-    var expandAllRows = (element) => {
-        element.closest('.pb_table').querySelectorAll('.pb_advanced_table_body > .pb_table_tr [data-advanced-table]').forEach((button) => {
-            button.dispatchEvent(new Event('click'));
-        });
-    };
-</script>
\ No newline at end of file
+<% end %>
\ No newline at end of file
diff --git a/playbook/app/pb_kits/playbook/pb_advanced_table/table_subrow_header.html.erb b/playbook/app/pb_kits/playbook/pb_advanced_table/table_subrow_header.html.erb
index 8870a1f9ea..8815af0bf0 100644
--- a/playbook/app/pb_kits/playbook/pb_advanced_table/table_subrow_header.html.erb
+++ b/playbook/app/pb_kits/playbook/pb_advanced_table/table_subrow_header.html.erb
@@ -23,12 +23,4 @@
                 <% end %>
             <% end %>
         <% end %>
-<% end %>
-
-<script type="text/javascript">
-    var expandAllSubRows = (element, rowDepth) => {
-        element.closest(".toggle-content").querySelectorAll('.depth-sub-row-' + rowDepth + ' [data-advanced-table]').forEach((button) => {
-            button.dispatchEvent(new Event('click'));
-        });
-    };
-</script>
\ No newline at end of file
+<% end %>
\ No newline at end of file