How to Allow Only One Radio Button to Be Checked

div class="form-row">                <div class="form-group col col-lg-6">                    <label for="rtypes" class="">Rtypes</label>
                    <div class="form-check">                        <input class="form-check-input" type="radio" name="radiobutton" id="" value="option1" checked>                        <label class="form-check-label" for="radiobutton1">                            RadioButton1                        </label>                    </div>
                    <div class="form-check">                        <input class="form-check-input" type="radio" name="radiobutton" id="radiobutton2"                               value="option2">                        <label class="form-check-label" for="exampleRadios2">                            RadioButton2                        </label>                    </div>
                </div>            </div>

Allow only one radio button to be selected from multiple groups of checkboxes

Have a ng-change method that stores the admin item in a scope property to keep track of which item has admin selected:

$scope.radioChanged = function (item) {
  if (item.selectedValue == "admin") {
    $scope.admin = item;
  }
  else if (item == $scope.admin) {
    $scope.admin = undefined;
  }
};

Then use ng-disabled on the admin radio button that will disable the radio button if an admin has been selected and the admin is not the current item.

<div ng-repeat="item in items">
  <label><input type="radio" name="{{item.id}}" value="admin" ng-model="item.selectedValue" ng-change="radioChanged(item)" ng-disabled="admin && item != admin"/>admin</label>
  <label><input type="radio" name="{{item.id}}" value="user" ng-model="item.selectedValue" ng-change="radioChanged(item)"/>user</label>
  <label><input type="radio" name="{{item.id}}" value="moderator" ng-model="item.selectedValue" ng-change="radioChanged(item)"/>moderator</label>
</div>

Plunkr

Allow only one radio button to be checked in a WPF datagird

Just put a GroupName for your RadioButton. All RadioButton in DataGrid should have a single selection because they have the same group.
This works for me.

<DataGridTemplateColumn Header="" Width="100">
    <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <RadioButton GroupName="abc" IsChecked="{Binding IsUserSelected}">
            </RadioButton>                                    
        </DataTemplate>
    </DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>

Only allow one radio button to be checked HTML

The reason it doesn't work is because your name attribute syntax is wrong.

name"portion_num" should be name="portion_num"

http://jsfiddle.net/65ba8/

How can I enable next button only if either one of the radio button is checked?

Another way is adding events on the html and hiding the button at the beginning.

<input class="form-check-input" name="q1" type="radio" value="1" onclick="handleClick(event);" />
<input class="form-check-input" name="q1" type="radio" value="2" onclick="handleClick(event);" />
<input class="form-check-input" name="q1" type="radio" value="3" onclick="handleClick(event);" />
<input class="form-check-input" name="q1" type="radio" value="4" onclick="handleClick(event);" />

js.

$("#display").hide();
function handleClick(e) {
  //console.log(e.target.value);
  $("#display").show();
}

---

Related Topics