Summary
After a form is submitted with an action, if one of the form's fields is a checkbox or radio input controlled by its checked prop, that element is reset as if it were uncontrolled. The same happens when the reset() method is called on the form. (Expected behavior: those fields are not reset.)
import { useState } from "react"
export default function Page() {
const [isChecked, setIsChecked] = useState(false);
return (
<form action={() => {
console.log("hello world!");
}}>
<label>
Some checkbox
<input type="checkbox"
checked={isChecked}
onChange={(e) => {
setIsChecked(e.target.checked);
}}
/>
</label>
<button>Submit form</button>
</form>
);
}Repro: https://codesandbox.io/p/sandbox/checkbox-reset-repro-sff3sr
Related: #30580, reactjs/react.dev#7340
Summary
After a form is submitted with an
action, if one of the form's fields is a checkbox or radio input controlled by itscheckedprop, that element is reset as if it were uncontrolled. The same happens when thereset()method is called on the form. (Expected behavior: those fields are not reset.)Repro: https://codesandbox.io/p/sandbox/checkbox-reset-repro-sff3sr
Related: #30580, reactjs/react.dev#7340