Skip to content

filterOption on select field remove autocomplete #13236

@jooshua-inglis

Description

@jooshua-inglis

Describe the Bug

Adding a filterOption value to a select field disables the autocomplete. There doesn't seem to be a way to add this support back in using the filterOption function since the function is not run after each key stroke.

Without filterOptions

without-filteroptions.mp4

With filterOptions

with-filteroptions.mp4

Link to the code that reproduces this issue

https://github.com/jooshua-inglis/payload-select-bug

Reproduction Steps

  • clone the repo
  • pnpm dev
  • create a user
  • go to the user
  • attempt to type option 1 into Some field
  • all options are still in the dropdown

Which area(s) are affected? (Select all that apply)

area: ui

Environment Info

Binaries:
  Node: 20.19.0
  npm: 10.8.2
  Yarn: 1.22.22
  pnpm: 10.6.4
Relevant Packages:
  payload: 3.48.0
  next: 15.3.2
  @payloadcms/email-nodemailer: 3.48.0
  @payloadcms/graphql: 3.48.0
  @payloadcms/next/utilities: 3.48.0
  @payloadcms/payload-cloud: 3.48.0
  @payloadcms/richtext-lexical: 3.48.0
  @payloadcms/translations: 3.48.0
  @payloadcms/ui/shared: 3.48.0
  react: 19.1.0
  react-dom: 19.1.0
Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 24.4.0: Fri Apr 11 18:34:14 PDT 2025; root:xnu-11417.101.15~117/RELEASE_ARM64_T8122
  Available memory (MB): 24576
  Available CPU cores: 8

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions