downshift-js / downshift-js/downshift

Make Selects built with `useMultipleSelection` work with traditional forms

Open
#1,450 2 comments 2 reactions 0 assignees View on GitHub
enhancement
Dominant language
JavaScript
Stars
12.3k
Forks
936
PR merge metrics
No merged PRs in 30d

Description

Hey,

I was wondering how to use `useMultipleSelection` to create a Multi-Select/Multi-Combobox that can be used to handle submit/change events of traditional forms (i.e. a way to create suitable name/value entries). I know that for a Single-Combobox, we can pass a `name` to `getInputProps` which works just fine.

```javascript

```

If we're doing the same for a multi-select, that of course does not work since there is more than just one value. We're currently rendering a hidden native `` and set the options' `selected` attributes according to our current state, then dispatching a `change` event programmatically so that we can do something like

```javascript

```

Doing so feels unnecessary and we're probably just missing something that's built-in to downshift.

In other words: We'd like our custom Multi-Select to behave just like its native counterpart without having to write custom code that enables this behavior. Is there an option we're missing or is this supposed to be solved in user-land?

```javascript
const handleChange= (event) => {
const formData = new FormData(event.currentTarget);
console.log([...formData.entries()]);
};


A
B

```

Thank you

- `downshift` version: 7.0.4
- `node` version: 16.17.0
- `npm` version: 8.15.0

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.