In my web page I have placed some radio buttons. But these buttons are not working properly. I can check multiple buttons.
code:
<label for="abc" style="margin-top:-20px;margin-left:40px">xyz</label> <input type="radio" id="abc" name="abc" > <label for="bcd" style="margin-top:-20px;margin-left:40px">abc</label> <input type="radio" id="bcd" name="bcd" > <label for="efg" style="margin-top:-20px;margin-left:40px">ccc</label> <input type="radio" id="efg" name="efg" >
fiddle
I want to check only one button. Please any one help me.
You cannot unselect radio buttons. That's because they're used if you want the user to select either option1 or option2 or option3 but prohibit selecting multiple values or leaving it empty (e.g. in case of selecting a Gender).
To check which radio button is selected in a form, we first get the desired input group with the type of input as an option and then the value of this selection can then be accessed by the val() method. This returns the name of the option that is currently selected.
Answer: To make a radio button not selectable, in the button's INPUT tag you can use an onclick event handler like this: <INPUT type="radio" name="myButton" value="theValue" onclick="this. checked=false; alert('Sorry, this option is not available!')
Because you've different value for name
attribute, they should have a common name
value, just like you group items.. for example
<input type="radio" name="group1" /> <input type="radio" name="group1" /> <input type="radio" name="group1" /> <!-- You can select any one from each group --> <input type="radio" name="group2" /> <input type="radio" name="group2" /> <input type="radio" name="group2" />
Demo
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With