Feature: input checkbox to toggle checked boxes true/false.

Patternslib / Patterns

Library for quickly applying rich interaction patterns without the need to write any JavaScript.

http://patternslib.com

Other

103 stars 43 forks source link

Feature: input checkbox to toggle checked boxes true/false. #1126

Closed petschki closed 1 year ago

petschki commented 1 year ago

I need a checkbox (for example at the header column of a table) to select/deselect all sibling checkboxes.

This extends the pat-checklist pattern to look for a <input class="toggle-all" /> which selects/deselets all its siblings according to its checked state.

petschki commented 1 year ago

https://user-images.githubusercontent.com/511761/214022309-dfd1897a-bb99-4042-a50e-a1569237f7c2.mov

petschki commented 1 year ago

Just found this PR: https://github.com/Patternslib/Patterns/pull/965 but I do not get pat-toggle to behave like here on an input:checkbox ... maybe I'm missing something.

thet commented 1 year ago

@petschki Thanks for your PR!

The PR‌ #965 was to fix pat-toggle - which only toggles a class on an element - to work together with pat-checklist and not steal pat-checklist the click event. before, toggling did work, but the checkbox wasn't checked/unchecked.

So you PR makes sense.

@cornae do you have any concerns about the new pat-checklist argument toggle which is a CSS selector to find toggle-button nad defaults to .toggle-all?