Beliebige Tabellenzeilen mit <details> schalten?

[fietur]

Verwende zum Ausblenden eines tr-Elements nicht display:none. Das HTML-Attribut zum Ausblenden ist hidden.

Der Hack funktioniert aber nicht mit hidden - damit werden die Zeilen angezeigt und sogar der <details>-Schalter verdeckt. Ein Indiz dafür, wie unsauber diese Lösung mit <details> ist.

Anstatt nun mehrere tr initial auszublenden kann man diese auch in gruppieren – tbody ist dafür vorgesehen – und hidden auf die ganze Gruppe anwenden: guckst du.

Ja, wenn man die Einträge gruppieren möchte. Sind sie aber wild verteilt, braucht man eine andere Lösung. Dass man mehrere tbody haben kann, wusste ich noch nicht.

Accessibility: Das Ausblenden des Buttons hab ich mal auskommentiert. Hier muss noch Fokus-Management betrieben werden. Wenn der Button, auf dem vorher der Fokus lag, verschwindet, landet der Fokus im Nirvana.

Stimmt, daran muss gedacht werden, wenn man das tatsächlich umsetzt.