Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update core components to support multiple=true on checkbox inputs #6111

Open
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

andrewtimberlake
Copy link

Currently, if you want to use the core components for multi value checkboxes, you can’t.
This change maintains backwards compatibility with standard on/off checkboxes and adds the ability to do this:

<form>
  <.input type="checkbox" name="field[active][]" value="true" label="Yes" multiple={true} />
  <.input type="checkbox" name="field[active][]" value="false" label="No" multiple={true} />
</form>

@SteffenDE
Copy link
Contributor

What is a "multi-value checkbox"? A checkbox is either on or off (or maybe indeterminate) and even in your example, how does it make sense to have an active field that can be both yes and no at the same time?

CoreComponents are meant to be modified if your app needs it. To me, this looks like such a thing that may be needed in some rare circumstances, but not worth being included by default.

@andrewtimberlake
Copy link
Author

andrewtimberlake commented Mar 4, 2025

That’s a simple example, but a practical one (granted this could more logically be radio buttons).
CleanShot 2025-03-04 at 13 13 10@2x

A multi-value checkbox is a collection of checkboxes that produce an array of results. It is similar to using a multi value select but sometimes it’s a much nicer UI.

I have made this change in a number of different projects:

  • check off from a list of possible files to attach to a message
  • check off from a list of fields to include when sending a webhook
  • check off all the regions this business belongs to
  • check off all the categories this project belongs to

@andrewtimberlake
Copy link
Author

And I’m about to implement another: checking off rows of a table (edit multiple, delete multiple etc).
Similar to this:
CleanShot 2025-03-04 at 13 21 13@2x

@SteffenDE
Copy link
Contributor

Those examples make more sense :)

I still think core components should focus on the basic functionality. Since the generators don't use this, I'm not sure that we should add it. Other opinions? @josevalim @chrismccord

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants