How to make a radio button read-only but not disabled?
The question "How to make radio button read-only?" has already been asked n times. But the solution is always disabled="disabled".
(There can also be complicated JavaScript solutions, that work with the click or change event and prevent the value's change, but all that has usually a smell of a more or less dirty hack.)
The problem / side effect of disabled="disabled" is, that it "removes" the field from the data set and it then isn't sent to the server.
What I want is to make the radio buttons read-only / not changeable -- but in the same time to let them be sent to the server on form submit. disabled doesn't meet this requirement, readonly seems not to work for radio buttons.
What is the correct HTML attribute for making a radio button read-only without to remove it from the form data set?
Answer
Try using some CSS:
input[type="radio"].readonly {
opacity: 0.5; /* not necessary */
pointer-events: none;
}