All radio is selected after click the single ion-radio in ionic3?
0
I will manage the ion-radio inside the loop in which we have to click the single radio all radio is selected instead of single radio.i want to get the single radio will be selected.i have tried Angular JS approch but it will be work but ion-radio value will be undefined.my html and ts code is?
<ion-card *ngFor="let item of itemList">
<ion-list radio-group [(ngModel)]="chart">
<ion-label>Present</ion-label>
<ion-radio [color]="myColor" value="Present" (ionSelect)="toggleColor()">ID</ion-radio>
<ion-radio [color]="myColor" value="Absent" (ionSelect)="toggleColor()">Address</ion-radio>
<ion-radio [color]="myColor" value="Leave" (ionSelect)="toggleColor()">Name</ion-radio>
Below our ts code:
this.itemList = [{
name : 'Harry',
id : 101
},
{
name : 'soni',
id : 101
},
{
name : 'deep',
id : 101
}]
}
toggleColor(item){
if(this.chart == 'Present') {
this.myColor = 'secondary';
} else if( this.chart == 'Absent') {
this.myColor = "danger";
} else {
this.myColor = "danger";
}
this.itemList.every(function(chart) {
return chart.Selected == true
})
}I have tried every function for manage the checkbox tell me what i am wrong here?
ionic3 radio-group
asked Jan 20 at 14:04
RomanRoman
189111
add a comment |
0
I will manage the ion-radio inside the loop in which we have to click the single radio all radio is selected instead of single radio.i want to get the single radio will be selected.i have tried Angular JS approch but it will be work but ion-radio value will be undefined.my html and ts code is?
<ion-card *ngFor="let item of itemList">
<ion-list radio-group [(ngModel)]="chart">
<ion-label>Present</ion-label>
<ion-radio [color]="myColor" value="Present" (ionSelect)="toggleColor()">ID</ion-radio>
<ion-radio [color]="myColor" value="Absent" (ionSelect)="toggleColor()">Address</ion-radio>
<ion-radio [color]="myColor" value="Leave" (ionSelect)="toggleColor()">Name</ion-radio>
Below our ts code:
this.itemList = [{
name : 'Harry',
id : 101
},
{
name : 'soni',
id : 101
},
{
name : 'deep',
id : 101
}]
}
toggleColor(item){
if(this.chart == 'Present') {
this.myColor = 'secondary';
} else if( this.chart == 'Absent') {
this.myColor = "danger";
} else {
this.myColor = "danger";
}
this.itemList.every(function(chart) {
return chart.Selected == true
})
}I have tried every function for manage the checkbox tell me what i am wrong here?
ionic3 radio-group
asked Jan 20 at 14:04
RomanRoman
189111
1
Can you reproduce your issue stackblitz.com/edit/ionic-yqd1pr?file=pages%2Fhome%2Fhome.ts
– Sudarshana Dayananda
Jan 21 at 10:00
check it sir i have generated
– Roman
Jan 22 at 5:41
add a comment |
0
0
0
I will manage the ion-radio inside the loop in which we have to click the single radio all radio is selected instead of single radio.i want to get the single radio will be selected.i have tried Angular JS approch but it will be work but ion-radio value will be undefined.my html and ts code is?
<ion-card *ngFor="let item of itemList">
<ion-list radio-group [(ngModel)]="chart">
<ion-label>Present</ion-label>
<ion-radio [color]="myColor" value="Present" (ionSelect)="toggleColor()">ID</ion-radio>
<ion-radio [color]="myColor" value="Absent" (ionSelect)="toggleColor()">Address</ion-radio>
<ion-radio [color]="myColor" value="Leave" (ionSelect)="toggleColor()">Name</ion-radio>
Below our ts code:
this.itemList = [{
name : 'Harry',
id : 101
},
{
name : 'soni',
id : 101
},
{
name : 'deep',
id : 101
}]
}
toggleColor(item){
if(this.chart == 'Present') {
this.myColor = 'secondary';
} else if( this.chart == 'Absent') {
this.myColor = "danger";
} else {
this.myColor = "danger";
}
this.itemList.every(function(chart) {
return chart.Selected == true
})
}I have tried every function for manage the checkbox tell me what i am wrong here?
ionic3 radio-group
asked Jan 20 at 14:04
RomanRoman
189111
I will manage the ion-radio inside the loop in which we have to click the single radio all radio is selected instead of single radio.i want to get the single radio will be selected.i have tried Angular JS approch but it will be work but ion-radio value will be undefined.my html and ts code is?
<ion-card *ngFor="let item of itemList">
<ion-list radio-group [(ngModel)]="chart">
<ion-label>Present</ion-label>
<ion-radio [color]="myColor" value="Present" (ionSelect)="toggleColor()">ID</ion-radio>
<ion-radio [color]="myColor" value="Absent" (ionSelect)="toggleColor()">Address</ion-radio>
<ion-radio [color]="myColor" value="Leave" (ionSelect)="toggleColor()">Name</ion-radio>
Below our ts code:
this.itemList = [{
name : 'Harry',
id : 101
},
{
name : 'soni',
id : 101
},
{
name : 'deep',
id : 101
}]
}
toggleColor(item){
if(this.chart == 'Present') {
this.myColor = 'secondary';
} else if( this.chart == 'Absent') {
this.myColor = "danger";
} else {
this.myColor = "danger";
}
this.itemList.every(function(chart) {
return chart.Selected == true
})
}I have tried every function for manage the checkbox tell me what i am wrong here?
Below our ts code:
this.itemList = [{
name : 'Harry',
id : 101
},
{
name : 'soni',
id : 101
},
{
name : 'deep',
id : 101
}]
}
toggleColor(item){
if(this.chart == 'Present') {
this.myColor = 'secondary';
} else if( this.chart == 'Absent') {
this.myColor = "danger";
} else {
this.myColor = "danger";
}
this.itemList.every(function(chart) {
return chart.Selected == true
})
}Below our ts code:
this.itemList = [{
name : 'Harry',
id : 101
},
{
name : 'soni',
id : 101
},
{
name : 'deep',
id : 101
}]
}
toggleColor(item){
if(this.chart == 'Present') {
this.myColor = 'secondary';
} else if( this.chart == 'Absent') {
this.myColor = "danger";
} else {
this.myColor = "danger";
}
this.itemList.every(function(chart) {
return chart.Selected == true
})
}ionic3 radio-group
ionic3 radio-group
asked Jan 20 at 14:04
RomanRoman
189111
asked Jan 20 at 14:04
RomanRoman
189111
edited Jan 22 at 5:43
Roman
asked Jan 20 at 14:04
RomanRoman
189111
asked Jan 20 at 14:04
RomanRoman
189111
asked Jan 20 at 14:04
RomanRoman
189111
189111
1
Can you reproduce your issue stackblitz.com/edit/ionic-yqd1pr?file=pages%2Fhome%2Fhome.ts
– Sudarshana Dayananda
Jan 21 at 10:00
check it sir i have generated
– Roman
Jan 22 at 5:41
add a comment |
1
Can you reproduce your issue stackblitz.com/edit/ionic-yqd1pr?file=pages%2Fhome%2Fhome.ts
– Sudarshana Dayananda
Jan 21 at 10:00
check it sir i have generated
– Roman
Jan 22 at 5:41
1
1
Can you reproduce your issue stackblitz.com/edit/ionic-yqd1pr?file=pages%2Fhome%2Fhome.ts
– Sudarshana Dayananda
Jan 21 at 10:00
Can you reproduce your issue stackblitz.com/edit/ionic-yqd1pr?file=pages%2Fhome%2Fhome.ts
– Sudarshana Dayananda
Jan 21 at 10:00
check it sir i have generated
– Roman
Jan 22 at 5:41
check it sir i have generated
– Roman
Jan 22 at 5:41
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54277240%2fall-radio-is-selected-after-click-the-single-ion-radio-in-ionic3%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54277240%2fall-radio-is-selected-after-click-the-single-ion-radio-in-ionic3%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
Can you reproduce your issue stackblitz.com/edit/ionic-yqd1pr?file=pages%2Fhome%2Fhome.ts
– Sudarshana Dayananda
Jan 21 at 10:00
check it sir i have generated
– Roman
Jan 22 at 5:41