How to make radio buttons in a set of 3

20 views
Skip to first unread message

Mayank Pandey

unread,
Mar 13, 2021, 1:16:07 PM3/13/21
to Developing Interactive Simulations in HTML5
Hello,

I am trying to make 3 radio buttons because I only want one of them to be selected at a time and one of them has to be the default option. Alternatively I have implemented the same with checkboxes but is there a way to make it so that if a checkbox is already tick marked and if it is clicked again the tick mark stays? Basically tricking it into thinking it was clicked the first time, ideally I want to see if radio buttons will work but if that's too complicated I want to stick with my checkbox implementation.

Sorry for the long question, Thank you for the help!

Chris Malley

unread,
Mar 14, 2021, 2:56:58 PM3/14/21
to Developing Interactive Simulations in HTML5
If you have a set of mututally-exclusive choices, radio button is the correct UI component, definitely not checkbox.

Radio buttons should be created as a "group", not individually.  PhET has 2 types of "radio button group" -- RectangularRadioButtonGroup and AquaRadioButtonGroup. Demos of radio button groups are in the "Buttons" screen of the sun demo application, runnable at sun/sun_en.html.  Source code for the Buttons screen demos is sun/js/demo/ButtonsScreenView.

If that doesn't answer your question, provide more specifics, like a sketch of what you want the UI to look like, and how you want it to behave.

Chris Malley
PixelZoom, Inc.


Reply all
Reply to author
Forward
0 new messages