React-select: [Validation] Using required attribute?

[welcoMattic]

Hi folks,

Is there any simple way to let us using native HTML5 attribute like required to handle native use cases of forms? Truly, your package is really useful, but do not break native things please.

As I see, the required attribute was working on v1, and it was dropped on v2. I can understand that is a lot of work to rewrite native component in React, but please if there are BC break, give us alternatives to fix them.

I can read here:

may be implemented in a later version

How can you say "may be" in this case? required is a native attribute of an input, it's must work in every case.

[meadow-tulips]

Even after putting required props true. The inner 'inputRef' element's domNode validity state is having { valid: true, missingValue: false } even when there is a missing value.

The required props is not passed to the inner input field for some reason.

[rystraum]

The bug actually originates in autosizeinput. I tracked it down to this file:
https://github.com/JedWatson/react-input-autosize/blob/master/lib/AutosizeInput.js

required prop is passed into Autosizeinput, but it does not pass forward props to the underlying input field.

[jkeruzec]

Interested also in this one (MUI have this required option by default). I think React-Select should have it too !

[OnkelTem]

So this is a form field which doesn't support basic validation? Not bad!

[smileservices]

I agree that basic form validation is a must to any component meant to function inside a form

[ashlincascade]

Bump! This is essential for form components.

[markusv]

any solution on this? I have a form with a lot of fields. All of them are validated with basic html5 validation. I am not sure if I can use this, if this does not support normal html validation..

[Methuselah96]

I've started a fork of react-select. Feel free to resubmit this issue on the fork and/or submit a PR to resolve this issue on the fork and we can get it merged and released.

[dolie]

bump

[ebonow]

The bug actually originates in autosizeinput. I tracked it down to this file:
https://github.com/JedWatson/react-input-autosize/blob/master/lib/AutosizeInput.js

required prop is passed into Autosizeinput, but it does not pass forward props to the underlying input field.

Not sure if a change happened, but this is no longer the case.
https://codesandbox.io/s/react-select-required-chu88

I take the working part back. Of course the input is cleared onFocus so it would always be empty. Let me think of a different approach and get a PR together.

[ebonow]

Greetings everyone!

We have identified this as high priority, moderate complexity, and something that has been requested by others. In an attempt to collect and better serve the intention of this issue, I will be closing this and related tickets requesting required/validation to put priority focus and attention on https://github.com/JedWatson/react-select/issues/4327

I hope you all can join the conversation there as there is new momentum behind this project. We are putting together releases for version v3.2 and v4 (more details coming in the next 24 hours) and your input could help determine if this makes it into either of those two or an even later version.

Thank you and appreciate your patience and input.