mgr/dashboard: remove duplicate ids from table column filters

Generate random ids for column filters to avoid id conflics on pages with multiple tables sharing the same column filters

Signed-off-by: nsedrickm <nsedrick101@gmail.com>
Fixes: https://tracker.ceph.com/issues/55869
(cherry picked from commit 78ec4addee07371cd8c86a91ec83dfe7324bd752)

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
index 576a1cbe76181ca035f44fb837fdf86dd06fdb8c..b73f0ad3973a6523bd0b3a19add425086fffb126 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
@@ -114,10 +114,10 @@
                 <input class="custom-control-input"
                        type="checkbox"
                        [name]="column.prop"
-                       [id]="column.prop"
+                       id="{{ column.prop }}{{ tableName }}"
                        [checked]="!column.isHidden">
                 <label class="custom-control-label"
-                       [for]="column.prop">{{ column.name }}</label>
+                       for="{{ column.prop }}{{ tableName }}">{{ column.name }}</label>
               </div>
             </button>
           </ng-container>