l2: sort and filter the forwarding table from its header

The table lists every learned and static entry in one flat block, which is
fine with a handful and unusable with a few hundred: finding out where one
MAC sits, or what a port has learned, meant reading the whole thing.

Make the column headings sort and give each one a filter box. Filters are
substring matches combined with AND, so "port 8 + static" is two keystrokes.
A counter above the table shows matched out of total, so a filter that hides
everything is obvious rather than looking like an empty table.

Sorting keeps the CPU entry from comparing as a number - it sorts last
instead of landing between ports 8 and 9, where a string-vs-number compare
would otherwise put it.

The filter inputs live inside the existing header cells rather than in a
second row: the paint loop addresses data rows as rows[i+1], and a second
header row would have shifted every one of them.
This commit is contained in:
d00f
2026-08-05 21:21:03 +02:00
parent 2974e4b66a
commit 5e901fb5c2
3 changed files with 19 additions and 1 deletions
+5
View File
@@ -164,3 +164,8 @@ margin: 30px 0;
select { text-align-last: right; font-family: monospace}
option { direction: rtl; font-family: sans-serif}
#vlanTable td { text-align: left; }
/* L2 table: sortable headers and per-column filters */
.l2sort{cursor:pointer;user-select:none}
.l2sort:hover{text-decoration:underline}
.l2filter{width:100%;box-sizing:border-box;font-weight:normal;font-size:0.9em}