Radio button error message won't display

[Mark Giffin]

Using AngularJS v1.6.6.

I have a set of radio buttons and I'm using the code below and I can't get the ng-messages to display when I click the Submit button if a radio button has not been selected. The code below does not work.

<div class="p fcRadio fcRequired" id="a10000000Radio">

  <label class="control-label" for="a10000000Radio">Required radio button list</label>

  <label for="abcradio1">

    <input class="li" id="abcradio1" ng-model="abcradio" ng-readonly="formComplete==true" type="radio" name="abcradio" value="Radio button 1" required="">Radio button 1</label>

  <div ng-messages="form.abcradio1.$error" ng-show="(form.$submitted || form.abcradio1.$touched) &amp;&amp; form.abcradio1.$invalid-required">

    <div ng-messages="required" style="color: red;">Radio button is required.</div>

  </div>

  <label for="abcradio2">

    <input class="li outside" id="abcradio2" ng-model="abcradio" ng-readonly="formComplete==true" type="radio" name="abcradio" value="Radio button 2" required="">Radio button 2</label>

</div>

But a similar setup like below works for checkboxes:

<div class="p fcCheck fcRequired">

  <label class="control-label" for="a1000000Check">Required check box</label>

  <input type="checkbox" name="a1000000Check" id="a1000000Check" ng-model="a1000000Check" ng-readonly="formComplete==true" required="">

    <div ng-messages="form.a1000000Check.$error" ng-show="(form.$submitted || form.a1000000Check.$touched) &amp;&amp; form.a1000000Check.$invalid-required">

      <div ng-messages="required" style="color: red;">Checkbox is required.</div>

    </div>

</div>

Thanks,

Mark

[Sander Elias]

Hi Mark,

I think the name of each radio-button must be identical. If that doesn't work, please provide a plnkr of something similar demonstrating your issue.

Regards

Sander