Only one radio button must be selected at a time

Question

I want to select one radio button out of two radio button using Javascript here is my html code I have

<div class="row">
    <div class="form-group">
        <label class="control-label col-sm-6">Feel Of The Cards : </label>
        <div class="col-sm-6">
            <input type="radio" value="NonEmbossed" name="feel_of_card" /> Non Embossed/Smooth Finished<br>
            <input type="radio" value="Embossed" name="feel_of_card1" /> Embossed/Linen Finished/Textured Cards
        </div>
    </div>
</div>

I want to make a separate function in which a one radio button will be selected out of two radio button?

what is the possible way to write javascript function ?

duplicate of http://stackoverflow.com/questions/9476617/how-to-set-radio-button-status-with-javascript — Vinod Louis, Feb 10 '17 at 05:47
Possible duplicate of [How to set radio button status with JavaScript](http://stackoverflow.com/questions/9476617/how-to-set-radio-button-status-with-javascript) — Vinod Louis, Feb 10 '17 at 05:48
c'mon man learn the basic first, do the research and then post the question — Dirty Developer, Feb 10 '17 at 05:48
Possible duplicate of [how to set that only one radio button can be checked](http://stackoverflow.com/questions/5419459/how-to-set-that-only-one-radio-button-can-be-checked) — Dirty Developer, Feb 10 '17 at 05:48
Please learn the basics of HTML before entering to javascript — Siddharth Pandey, Feb 10 '17 at 05:50

score 1 · Answer 1 · edited Feb 11 '17 at 22:19

You don't need JavaScript to do that. Just give same name to both checkboxes

<div class="row">
  <div class="form-group">
    <label class="control-label col-sm-6">Feel Of The Cards : </label>
    <div class="col-sm-6">
      <input type="radio" value="NonEmbossed" name="feel_of_card" /> 
      Non Embossed/Smooth Finished<br />
      <input type="radio" value="Embossed" name="feel_of_card" /> 
      Embossed/Linen Finished/Textured Cards
    </div>
  </div>
</div>

score 1 · Answer 2 · answered Feb 10 '17 at 06:01

<div class="row">
                        <div class="form-group">
                        <label class="control-label col-sm-6">Feel Of The Cards : </label>
                        <div class="col-sm-6">
                        <input id="_1234"  type="radio" value="NonEmbossed" name="feel_of_card" /> Non Embossed/Smooth Finished<br>
                        <input id="_1235" type="radio" value="Embossed" name="feel_of_card" /> Embossed/Linen Finished/Textured Cards</div>
                        </div>
                        </div>

Why do you use all instead of id value? Also do not mix CSS syntax (# for identifier) with native JS Native JS solution:

document.getElementById("_1234").checked = true;

JQuery solution:

$("#_1234").prop("checked", true);

Only one radio button must be selected at a time

2 Answers2

Linked