Radio buttons selected on page load - unwanted
I have a form with a couple of radio buttons.
The form is wrapped within a <dialog> element and will be opened only when a button "Back this project" is clicked.
When opened, however, the first radio button is always selected and there should be none selected before a user chooses any.
Is this default browser behavior or?
Also when the form is closed and re-opened, the previous choice is remembered. How can I deselect all radio buttons once the form is re-opened (I know deleting cache is a bad option therefore wouldn't go for that one)
Here's my codepen: https://codepen.io/d8701a/pen/bGJKRWO
Thanks!
7 Replies
it's not checked for me on either firefox or chrome
can't reproduce
maybe you submitted it once and now it has autocomplete
as for resetting the radiobuttons, you can call
.reset() on the form, or you can run through all the input[type="radio"] fields using a loop and querySelectorAll to set checked to falseon the close and cancel events of the modal
the .reset method is the best choice, btw
only if you don't mind the rest of the form also resetting
there's pledge amounts you may want to keep
that's a good point
Thank you all for your help. I decided to go with the .reset() method on the form. I figured that if users were to close the form, they most likely wouldn't mind their pledge amounts reset as well. Again, thanks for quick and helpful answers, I appreciate this! 🙂