Angular- nested radio button

[KavyaParticipant]

I have added nested radio buttons and this isn’t working properly.
groupName is different, still the one checked gets unchecked.

<fieldset>
<jqxRadioButton [width]=”250″ [groupName]=”1″ [height]=”25″ [theme]=”appTheme” [checked]=”true”>
<span>Device</span>
</jqxRadioButton>
<fieldset *ngIf=”automationType == ‘device'” style=”margin-left: 40px;”>
<jqxRadioButton #nativeRBtn [width]=”250″ [groupName]=”2″ [height]=”25″ [theme]=”appTheme” [checked]=”true”
(onChecked)=”deviceType = ‘android'”>
<span>Android</span>
</jqxRadioButton>
<fieldset *ngIf=”deviceType == ‘android'” style=”margin-left: 40px;”>
<jqxRadioButton #nativeRBtn [width]=”250″ [groupName]=”3″ [height]=”25″ [theme]=”appTheme” [checked]=”true”>
<span>Native</span>
</jqxRadioButton>
<jqxRadioButton [width]=”250″ [groupName]=”3″ [height]=”25″ [theme]=”appTheme”>
<span>Web</span>
</jqxRadioButton>
</fieldset>
<jqxRadioButton [width]=”250″ [groupName]=”2″ [height]=”25″ [theme]=”appTheme”>
<span>iOS</span>
</jqxRadioButton>
<fieldset *ngIf=”deviceType == ‘ios'” style=”margin-left: 40px;”>
<jqxRadioButton [width]=”250″ [groupName]=”4″ [height]=”25″ [theme]=”appTheme” [checked]=”true”>
<span>Native</span>
</jqxRadioButton>
<jqxRadioButton [width]=”250″ [groupName]=”4″ [height]=”25″ [theme]=”appTheme”>
<span>Web</span>
</jqxRadioButton>
</fieldset>
</fieldset>
<jqxRadioButton [width]=”250″ [groupName]=”1″ [height]=”25″ [theme]=”appTheme”>
<span>Desktop</span>
</jqxRadioButton>
</fieldset>

[adminKeymaster]

Hi Kavya,

Could you please share a Stackblitz sample about this?

Best regards,
Peter Stoev

jQWidgets Team
https://www.jqwidgets.com/

[Author]

Posts