Menu
I want to get the selected radio button value, on (ionChange) event in radio-group in Ionic2.
My Html code is
<ion-list radio-group *ngFor="let question of mcqData; let i= index;" (ionChange)="mcqAnswer(i)">
<ion-list-header>
{{question.questionText}}
</ion-list-header>
<ion-item>
<ion-label>{{question.optionA}}</ion-label>
<ion-radio value="1"></ion-radio>
</ion-item>
<ion-item>
<ion-label>{{question.optionB}}</ion-label>
<ion-radio value="2"></ion-radio>
</ion-item>
<ion-item>
<ion-label>{{question.optionC}}</ion-label>
<ion-radio value="3"></ion-radio>
</ion-item>
<ion-item>
<ion-label>{{question.optionD}}</ion-label>
<ion-radio value="4"></ion-radio>
</ion-item>
</ion-list>
How can I get ion-radio value in mcqQuesiton() on (ion-change).
I have number or radio-groups on a single page, as it is a multiple choice question page.
629
Radio components are generally used as a set of related options inside of a group, but it can also be used alone. A radio button options can be checked by selecting it or checked programmatically by setting the checked property. It also uses a disabled attribute to disable the user from changing the value.
Solution for IONIC 5: i) define radio group reference. ii) add a click event with radio group. It will reset the radio button also the model/formcontrol too.
Pressing on a radio will check it. They can also be checked programmatically by setting the checked property. An ion-radio-group can be used to group a set of radios. When radios are inside of a radio group , only one radio in the group will be checked at any time.
You can use ionSelect event of <ion-radio> to pass the value.
...
<ion-item>
<ion-label>{{question.optionA}}</ion-label>
<ion-radio value="1" (ionSelect)="mcqAnswer(i,1)"></ion-radio>
</ion-item>
<ion-item>
<ion-label>{{question.optionB}}</ion-label>
<ion-radio value="2" (ionSelect)="mcqAnswer(i,2)"></ion-radio>
</ion-item>
...
In your typescript (.ts) file it will be something like
mcqAnswer(questionID,answer){
...
}
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
