diff --git a/packages/react/select/src/Select.tsx b/packages/react/select/src/Select.tsx index 53fbd1ff50..6b122c99e3 100644 --- a/packages/react/select/src/Select.tsx +++ b/packages/react/select/src/Select.tsx @@ -91,6 +91,7 @@ interface SelectProps { autoComplete?: string; disabled?: boolean; required?: boolean; + form?: string; } const Select: React.FC = (props: ScopedProps) => { @@ -108,6 +109,7 @@ const Select: React.FC = (props: ScopedProps) => { autoComplete, disabled, required, + form, } = props; const popperScope = usePopperScope(__scopeSelect); const [trigger, setTrigger] = React.useState(null); @@ -127,7 +129,7 @@ const Select: React.FC = (props: ScopedProps) => { const triggerPointerDownPosRef = React.useRef<{ x: number; y: number } | null>(null); // We set this to true by default so that events bubble to forms without JS (SSR) - const isFormControl = trigger ? Boolean(trigger.closest('form')) : true; + const isFormControl = trigger ? (Boolean(trigger.closest('form')) || form) : true; const [nativeOptionsSet, setNativeOptionsSet] = React.useState(new Set()); // The native `select` only associates the correct default value if the corresponding @@ -189,6 +191,7 @@ const Select: React.FC = (props: ScopedProps) => { // enable form autofill onChange={(event) => setValue(event.target.value)} disabled={disabled} + form={form} > {value === undefined ?