feat-disable-manual-sort

custom-cards · May 7, 2024 · f31d438 · f31d438
1 parent 2bd1c62
commit f31d438
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 20 deletions.
diff --git a/docs/config-ref.md b/docs/config-ref.md
@@ -17,6 +17,7 @@ Flex Table gives you the possibility to visualize any tabular data within Lovela
 | `title`                | string          |   optional    | A title for the card
 | `strict`               | boolean         |   optional    | If `true`, each cell must have a match, or row will be hidden [example](https://github.com/custom-cards/flex-table-card/blob/master/docs/example-cfg-sorting-strict.md)
 | `sort_by[-\|+]`        | col-id          |   optional    | Sort by given column, '+' (ascending) or '-' (descending) [example](https://github.com/custom-cards/flex-table-card/blob/master/docs/example-cfg-sorting-strict.md)
+| `disable_header_sort`  | boolean         |   optional    | Disable manual sorting by column headers (default: `false`)
 | `max_rows`             | int             |   optional    | Restrict the number of (shown) rows to this maximum number
 | `clickable`            | boolean         |   optional    | Activates the entities' on-click popup dialog
 | `css`                  | section         |   optional    | Modify the CSS-style of this flex-table instance [(css example)](https://github.com/custom-cards/flex-table-card/blob/master/docs/example-cfg-css.md)

diff --git a/flex-table-card.js b/flex-table-card.js
@@ -572,26 +572,29 @@ class FlexTableCard extends HTMLElement {
         // append card to _root_ node...
         root.appendChild(card);
 
-        // add sorting click handler to header elements
-        this.tbl.headers.map((obj, idx) => {
-            root.getElementById(obj.id).onclick = (click) => {
-                // remove previous sort by
-                this.tbl.headers.map((obj, idx) => {
-                    root.getElementById(obj.id).classList.remove("headerSortDown");
-                    root.getElementById(obj.id).classList.remove("headerSortUp");
-                });
-                this.tbl.updateSortBy(idx);
-                if (this.tbl.sort_by.indexOf("+") != -1) {
-                    root.getElementById(obj.id).classList.add("headerSortUp");
-                } else {
-                    root.getElementById(obj.id).classList.add("headerSortDown");
-                }
-                this._updateContent(
-                    root.getElementById("flextbl"),
-                    this.tbl.get_rows()
-                );
-            };
-        });
+        // add sorting click handler to header elements, if allowed
+        if (!config.disable_header_sort) {
+
+            this.tbl.headers.map((obj, idx) => {
+                root.getElementById(obj.id).onclick = (click) => {
+                    // remove previous sort by
+                    this.tbl.headers.map((obj, idx) => {
+                        root.getElementById(obj.id).classList.remove("headerSortDown");
+                        root.getElementById(obj.id).classList.remove("headerSortUp");
+                    });
+                    this.tbl.updateSortBy(idx);
+                    if (this.tbl.sort_by.indexOf("+") != -1) {
+                        root.getElementById(obj.id).classList.add("headerSortUp");
+                    } else {
+                        root.getElementById(obj.id).classList.add("headerSortDown");
+                    }
+                    this._updateContent(
+                        root.getElementById("flextbl"),
+                        this.tbl.get_rows()
+                    );
+                };
+            });
+        }
 
         this._config = cfg;
     }