Skip to content

Create Combobox component #984

Open
@Flo0807

Description

@Flo0807

Fields like Backpex.Fields.MultiSelect and Backpex.Fields.HasMany come with a multi select. This multi select uses a daisyUI dropdown under the hood that contains a list of checkboxes.

See https://github.com/naymspace/backpex/blob/0.11.0/lib/backpex/html/form.ex#L246

The Backpex multi select component has some limitations:

  • The number of fetched options cannot be limited (might be a problem for huge lists)
  • It has issues when being used inside elements that have an overflow defined (e.g., in tables or in resource action modals)
  • It cannot be reused in other places
  • It is difficult to limit min or max selected values
  • Selection / Deselection does not always trigger form validation (see Backpex.Fields.MultiSelect)

The goal is to create a generic Combobox / Autocomplete / MuliSelect component that is easy to use inside Backpex fields (HasMany, MultiSelect) as well as in filters (MultiSelect filter) and outside Backpex.

We might want to use some JavaScript to reduce server roundtrips, as we can now provide hooks via Backpex.

It is a good idea to make it work with single and multiple values so that it can be used for Selects (e.g., Backpex.Fields.BelongsTo) as it would be great to have a search functionality there, too.

Examples

Some examples of Comboboxes with a good UX.

Metadata

Metadata

Assignees

No one assigned

    Labels

    needs-discussionAn issue that still needs speficiation.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions